theming – How do I get the path or url to commerce product for views-view-fields.html.twig

I use the commerce module and VIEWS to build a product list. For this product list I like to have an output like this:


                <ul>
                  <li>
                    <a href="LINK-TO-PRODUCT">
                      <div>
                        <h2>product 1</h2>
                        <img src="" alt={""}>
                        <p>Some description</p>  
                      </div>
                    </a>
                  </li>
                  <li>
                    <a href="LINK-TO-PRODUCT">
                      <div>
                        <h2>product 2</h2>
                        <img src="" alt={""}>
                        <p>Some description</p>  
                      </div>
                    </a>
                  </li>
                  ...
                </ul>

It is a list where you have clickable items and the click have to link to the detail page of the product. So, my questions is: how do I get the path or url to product, which I can use in twig file views-view-fields--productList.html.twig?

<a href="LINK-TO-PRODUCT">
  <div>
    {% for field in fields -%}
    {{ field.separator }}
    {%- if field.wrapper_element -%}
      <{{ field.wrapper_element }}{{ field.wrapper_attributes }}>
    {%- endif %}
    {%- if field.label -%}
    {%- if field.label_element -%}
    <{{ field.label_element }}{{ field.label_attributes }}>{{ field.label }}{{ field.label_suffix }}</{{ field.label_element }}>
  {%- else -%}
    {{ field.label }}{{ field.label_suffix }}
  {%- endif %}
  {%- endif %}
  {%- if field.element_type -%}
  <{{ field.element_type }}{{ field.element_attributes }}>{{ field.content }}</{{ field.element_type }}>
  {%- else -%}
    {{ field.content }}
  {%- endif %}
  {%- if field.wrapper_element -%}
    </{{ field.wrapper_element }}>
  {%- endif %}
  {%- endfor %}
  </div>
</a>