Browse Etnia Barcelona Optical Collection

Purpose

Browse Etnia Barcelona's optical eyewear collection and return structured product candidates so a caller can identify frames matching criteria such as color, tortoiseshell pattern, or shape.

When to Use

Use when the caller wants to inspect or compare products in Etnia Barcelona's optical collection. Supply the desired locale, such as en-us or en-fr, and compare the extracted card text and images against the requested style.

Workflow

1. Build the collection URL directly as https://etniabarcelona.com/{locale}/collections/optical (for example, en-us or en-fr).
2. Navigate to that URL. If the consent banner is present, click button#shopify-pc__banner__btn-decline; then evaluate the extractor below on the collection page.
3. Use each result's title, searchText, image, and url to identify frames matching the caller's descriptive or visual criteria. Open a product URL only when more detail is needed.

(() => {
  const seen = new Set();
  const products = [];
  const links = [...document.querySelectorAll('a[href*="/products/"]')];
  for (const link of links) {
    const rawHref = link.getAttribute("href");
    if (!rawHref) continue;
    const url = new URL(rawHref, location.href).href;
    if (seen.has(url)) continue;
    seen.add(url);
    const card =
      link.closest(
        "[data-product-card], .product-card, .card-wrapper, .grid__item, li",
      ) || link;
    const titleNode = card.querySelector(
      ".card__heading a, .product-card__title, .card-information__text, [data-product-title], h3, h2",
    );
    const imageNode = card.querySelector("img");
    const priceNode = card.querySelector('.price, .price-item, [class*="price"]');
    products.push({
      title: (titleNode?.textContent || link.textContent || "")
        .replace(/\\s+/g, " ")
        .trim(),
      url,
      image: imageNode
        ? imageNode.currentSrc ||
          imageNode.src ||
          imageNode.getAttribute("data-src") ||
          ""
        : "",
      price: (priceNode?.textContent || "").replace(/\\s+/g, " ").trim(),
      searchText: (card.innerText || "").replace(/\\s+/g, " ").trim(),
    });
  }
  return products;
})();

Site-Specific Gotchas

• The collection is locale-prefixed; use the requested locale rather than assuming the site's homepage or a locale-free path.
• Shopify's privacy banner can cover the collection. Decline it with button#shopify-pc__banner__btn-decline before relying on the product grid.
• Product-card selectors may vary with the storefront theme; the extractor uses several fallback selectors and deduplicates by /products/ URL.
• The collection page exposes candidate metadata but may not explicitly encode visual attributes such as “round” or “blue tortoiseshell”; use the returned image and searchText, and open individual product pages for confirmation.

Expected Output

An array of unique optical product candidates, each shaped as {title, url, image, price, searchText}. The caller can rank or filter these candidates against the requested frame color, pattern, and shape.