@intuned/browser-dev 2.2.3-test-build.0

package/dist/ai/tests/testExtractStructuredData.spec.js

@@ -0,0 +1,646 @@
+"use strict";
+
+var _extendedTest = require("../../common/extendedTest");
+var _ = require("..");
+var _playwrightCore = require("playwright-core");
+var _dotenv = require("dotenv");
+var _zod = require("zod");
+(0, _dotenv.config)();
+const productListTemplate = `
+<div class="product-list">
+  <div class="product" data-id="1">
+    <h2 class="title">iPhone 14 Pro</h2>
+    <div class="price">$999</div>
+    <div class="stock">In Stock</div>
+    <div class="rating">4.5</div>
+    <ul class="features">
+      <li>5G Capable</li>
+      <li>A16 Bionic</li>
+      <li>48MP Camera</li>
+    </ul>
+  </div>
+  <div class="product" data-id="2">
+    <h2 class="title">MacBook Air M2</h2>
+    <div class="price">$1199</div>
+    <div class="stock">Low Stock</div>
+    <div class="rating">4.8</div>
+    <ul class="features">
+      <li>M2 Chip</li>
+      <li>13.6" Display</li>
+      <li>18hr Battery</li>
+    </ul>
+  </div>
+  <div class="product" data-id="3">
+    <h2 class="title">AirPods Pro</h2>
+    <div class="price">$249</div>
+    <div class="stock">Out of Stock</div>
+    <div class="rating">4.7</div>
+    <ul class="features">
+      <li>Active Noise Cancellation</li>
+      <li>Spatial Audio</li>
+      <li>Water Resistant</li>
+    </ul>
+  </div>
+</div>
+`;
+const articleTemplate = `
+<article class="blog-post">
+  <header>
+    <h1>The Future of AI in 2024</h1>
+    <div class="metadata">
+      <span class="author">John Doe</span>
+      <time datetime="2024-03-15">March 15, 2024</time>
+      <span class="read-time">8 min read</span>
+    </div>
+    <div class="tags">
+      <span class="tag">AI</span>
+      <span class="tag">Technology</span>
+      <span class="tag">Future</span>
+    </div>
+  </header>
+  <div class="content">
+    <p>Artificial Intelligence has seen remarkable growth in recent years...</p>
+    <h2>Key Developments</h2>
+    <ul>
+      <li>Advanced Language Models</li>
+      <li>Computer Vision Breakthroughs</li>
+      <li>Ethical AI Guidelines</li>
+    </ul>
+    <p>These advancements are reshaping industries...</p>
+  </div>
+  <footer>
+    <div class="engagement">
+      <span class="likes">1.2k likes</span>
+      <span class="comments">83 comments</span>
+      <span class="shares">456 shares</span>
+    </div>
+  </footer>
+</article>
+`;
+const userProfileTemplate = `
+<div class="user-profile">
+  <div class="profile-header">
+    <img src="https://example.com/avatar.jpg" alt="User Avatar" class="avatar" />
+    <h1 class="name">Sarah Wilson</h1>
+    <div class="status">Premium Member</div>
+  </div>
+  <div class="profile-stats">
+    <div class="stat">
+      <span class="value">1,234</span>
+      <span class="label">Followers</span>
+    </div>
+    <div class="stat">
+      <span class="value">567</span>
+      <span class="label">Following</span>
+    </div>
+    <div class="stat">
+      <span class="value">89</span>
+      <span class="label">Posts</span>
+    </div>
+  </div>
+  <div class="profile-details">
+    <div class="location">📍 San Francisco, CA</div>
+    <div class="bio">Tech enthusiast & photographer 📱 📸</div>
+    <div class="joined-date">Joined: January 2020</div>
+  </div>
+  <div class="badges">
+    <span class="badge">🏆 Top Contributor</span>
+    <span class="badge">✨ Trending Creator</span>
+    <span class="badge">🎯 Pro User</span>
+  </div>
+</div>
+`;
+_extendedTest.describe.skip("Extract data from page tests", () => {
+  let browser;
+  let page;
+  const getPromptVariation = basePrompt => {
+    const variations = [".", " ", "..", "  ", "..."];
+    const randomVariation = variations[Math.floor(Math.random() * variations.length)];
+    return basePrompt + randomVariation;
+  };
+  const sharedPrompts = {
+    htmlStrategy: "Extract product information including title, price, stock status, and rating",
+    markdownStrategy: "Extract article metadata including title, author, date, read time, and tags",
+    arrayStrings: "Extract all unique tags from the article",
+    arrayObjects: "Extract each product's title and list of features",
+    objectNested: "Extract user profile information with nested stats",
+    objectConstraints: "Extract article metadata with specific string formats",
+    domMatching: "Extract follower counts",
+    cachingBasic: "Extract product title and price",
+    imageStrategy: "Extract article metadata including title, author, date, read time, and tags"
+  };
+  (0, _extendedTest.beforeAll)(async () => {
+    browser = await _playwrightCore.chromium.launch({
+      headless: false
+    });
+  });
+  (0, _extendedTest.afterAll)(async () => {
+    await browser.close();
+  });
+  (0, _extendedTest.beforeEach)(async () => {
+    page = await browser.newPage();
+  });
+  (0, _extendedTest.afterEach)(async () => {
+    await page.close();
+  });
+  (0, _extendedTest.describe)("Strategy Tests", () => {
+    (0, _extendedTest.describe)("HTML Strategy", () => {
+      (0, _extendedTest.test)("should extract product list using HTML strategy", async () => {
+        await page.setContent(productListTemplate);
+        const data = await (0, _.extractStructuredData)({
+          source: page,
+          dataSchema: {
+            type: "array",
+            items: {
+              type: "object",
+              properties: {
+                price: {
+                  type: "string",
+                  description: "Product price"
+                },
+                title: {
+                  type: "string",
+                  description: "Product name"
+                },
+                stock: {
+                  type: "string",
+                  description: "Stock status"
+                },
+                rating: {
+                  type: "string",
+                  description: "Product rating"
+                }
+              },
+              required: ["title", "price", "stock"]
+            }
+          },
+          prompt: "extract product information including title, price, stock status, and rating pls",
+          enableDomMatching: true,
+          strategy: "HTML",
+          model: "o4-mini"
+        });
+        (0, _extendedTest.expect)(Array.isArray(data)).toBe(true);
+        (0, _extendedTest.expect)(data.length).toBe(3);
+        (0, _extendedTest.expect)(data[0]).toHaveProperty("title", "iPhone 14 Pro");
+        (0, _extendedTest.expect)(data[0]).toHaveProperty("price", "$999");
+        (0, _extendedTest.expect)(data[0]).toHaveProperty("stock", "In Stock");
+      });
+    });
+    (0, _extendedTest.describe)("IMAGE Strategy", () => {
+      (0, _extendedTest.test)("should extract article data using IMAGE strategy", async () => {
+        await page.setContent(articleTemplate);
+        const data = await (0, _.extractStructuredData)({
+          source: page,
+          dataSchema: {
+            type: "object",
+            properties: {
+              title: {
+                type: "string",
+                description: "Article title"
+              },
+              author: {
+                type: "string",
+                description: "Author name"
+              },
+              date: {
+                type: "string",
+                description: "Publication date"
+              },
+              readTime: {
+                type: "string",
+                description: "Reading time"
+              },
+              tags: {
+                type: "array",
+                items: {
+                  type: "string"
+                },
+                description: "Article tags"
+              }
+            }
+          },
+          prompt: getPromptVariation(sharedPrompts.imageStrategy),
+          enableDomMatching: false,
+          strategy: "IMAGE",
+          model: "claude-3-5-sonnet-20240620",
+          apiKey: process.env.ANTHROPIC_API_KEY
+        });
+        (0, _extendedTest.expect)(data).toHaveProperty("title", "The Future of AI in 2024");
+        (0, _extendedTest.expect)(data).toHaveProperty("author", "John Doe");
+      });
+    });
+    (0, _extendedTest.describe)("MARKDOWN Strategy", () => {
+      (0, _extendedTest.test)("should extract article data using MARKDOWN strategy", async () => {
+        await page.setContent(articleTemplate);
+        const data = await (0, _.extractStructuredData)({
+          source: page,
+          dataSchema: {
+            type: "object",
+            properties: {
+              title: {
+                type: "string",
+                description: "Article title"
+              },
+              author: {
+                type: "string",
+                description: "Author name"
+              },
+              date: {
+                type: "string",
+                description: "Publication date"
+              },
+              readTime: {
+                type: "string",
+                description: "Reading time"
+              },
+              tags: {
+                type: "array",
+                items: {
+                  type: "string"
+                },
+                description: "Article tags"
+              }
+            },
+            required: ["title", "author", "tags"]
+          },
+          prompt: getPromptVariation(sharedPrompts.markdownStrategy),
+          enableDomMatching: false,
+          strategy: "MARKDOWN",
+          model: "claude-3-5-sonnet-20240620",
+          apiKey: process.env.ANTHROPIC_API_KEY
+        });
+        (0, _extendedTest.expect)(data).toHaveProperty("title", "The Future of AI in 2024");
+        (0, _extendedTest.expect)(data).toHaveProperty("author", "John Doe");
+        (0, _extendedTest.expect)(data.tags).toContain("AI");
+        (0, _extendedTest.expect)(data.tags).toContain("Technology");
+      });
+    });
+  });
+  (0, _extendedTest.describe)("Schema Tests", () => {
+    (0, _extendedTest.describe)("Array Schema", () => {
+      (0, _extendedTest.test)("should extract array of strings", async () => {
+        await page.setContent(articleTemplate);
+        const data = await (0, _.extractStructuredData)({
+          source: page,
+          dataSchema: {
+            type: "array",
+            items: {
+              type: "string"
+            },
+            description: "List of article tags",
+            minItems: 2,
+            maxItems: 5,
+            uniqueItems: true
+          },
+          prompt: getPromptVariation(sharedPrompts.arrayStrings),
+          enableDomMatching: false,
+          strategy: "HTML",
+          model: "claude-3-5-sonnet-20240620",
+          apiKey: process.env.ANTHROPIC_API_KEY
+        });
+        (0, _extendedTest.expect)(Array.isArray(data)).toBe(true);
+        (0, _extendedTest.expect)(data.length).toBeGreaterThanOrEqual(2);
+        (0, _extendedTest.expect)(data.length).toBeLessThanOrEqual(5);
+        (0, _extendedTest.expect)(new Set(data).size).toBe(data.length);
+        (0, _extendedTest.expect)(data).toContain("AI");
+        (0, _extendedTest.expect)(data).toContain("Technology");
+      });
+      (0, _extendedTest.test)("should extract array of objects", async () => {
+        await page.setContent(productListTemplate);
+        const data = await (0, _.extractStructuredData)({
+          source: page,
+          dataSchema: {
+            type: "array",
+            items: {
+              type: "object",
+              properties: {
+                title: {
+                  type: "string"
+                },
+                features: {
+                  type: "array",
+                  items: {
+                    type: "string"
+                  }
+                }
+              },
+              required: ["title", "features"]
+            },
+            minItems: 1
+          },
+          prompt: getPromptVariation(sharedPrompts.arrayObjects),
+          enableDomMatching: false,
+          strategy: "HTML",
+          model: "claude-3-5-sonnet-20240620",
+          apiKey: process.env.ANTHROPIC_API_KEY
+        });
+        (0, _extendedTest.expect)(Array.isArray(data)).toBe(true);
+        (0, _extendedTest.expect)(data[0].title).toBe("iPhone 14 Pro");
+        (0, _extendedTest.expect)(Array.isArray(data[0].features)).toBe(true);
+        (0, _extendedTest.expect)(data[0].features).toContain("5G Capable");
+      });
+    });
+    (0, _extendedTest.describe)("Object Schema", () => {
+      (0, _extendedTest.test)("should extract nested object with mixed types", async () => {
+        try {
+          await page.setContent(userProfileTemplate);
+        } catch (error) {
+          await page.reload();
+          await page.setContent(userProfileTemplate);
+        }
+        const data = await (0, _.extractStructuredData)({
+          source: page,
+          dataSchema: {
+            type: "object",
+            properties: {
+              user: {
+                type: "object",
+                properties: {
+                  name: {
+                    type: "string"
+                  },
+                  status: {
+                    type: "string"
+                  }
+                },
+                required: ["name", "status"]
+              },
+              stats: {
+                type: "object",
+                properties: {
+                  followers: {
+                    type: "string"
+                  },
+                  following: {
+                    type: "string"
+                  },
+                  posts: {
+                    type: "string"
+                  }
+                },
+                required: ["followers", "following", "posts"]
+              },
+              badges: {
+                type: "array",
+                items: {
+                  type: "string"
+                }
+              }
+            },
+            required: ["user", "stats"]
+          },
+          prompt: getPromptVariation(sharedPrompts.objectNested),
+          enableDomMatching: false,
+          strategy: "HTML",
+          model: "claude-3-5-sonnet-20240620",
+          apiKey: process.env.ANTHROPIC_API_KEY
+        });
+        (0, _extendedTest.expect)(data.user.name).toBe("Sarah Wilson");
+        (0, _extendedTest.expect)(data.user.status).toBe("Premium Member");
+        (0, _extendedTest.expect)(data.stats.followers).toBe("1,234");
+        (0, _extendedTest.expect)(Array.isArray(data.badges)).toBe(true);
+      });
+      (0, _extendedTest.test)("should extract object with string constraints", async () => {
+        await page.setContent(articleTemplate);
+        const data = await (0, _.extractStructuredData)({
+          source: page,
+          dataSchema: {
+            type: "object",
+            properties: {
+              title: {
+                type: "string",
+                minLength: 10,
+                maxLength: 100
+              },
+              author: {
+                type: "string",
+                pattern: "^[A-Za-z ]+$"
+              },
+              readTime: {
+                type: "string",
+                pattern: "^\\d+ min read$"
+              }
+            },
+            required: ["title", "author", "readTime"]
+          },
+          prompt: getPromptVariation(sharedPrompts.objectConstraints),
+          enableDomMatching: false,
+          strategy: "HTML",
+          model: "claude-3-5-sonnet-20240620",
+          apiKey: process.env.ANTHROPIC_API_KEY
+        });
+        (0, _extendedTest.expect)(data.title.length).toBeGreaterThanOrEqual(10);
+        (0, _extendedTest.expect)(data.title.length).toBeLessThanOrEqual(100);
+        (0, _extendedTest.expect)(data.author).toMatch(/^[A-Za-z ]+$/);
+        (0, _extendedTest.expect)(data.readTime).toMatch(/^\d+ min read$/);
+      });
+    });
+  });
+  (0, _extendedTest.describe)("DOM Matching and Caching Tests", () => {
+    (0, _extendedTest.describe)("DOM Matching", () => {
+      (0, _extendedTest.test)("should fail when using non-string types with DOM matching enabled", async () => {
+        try {
+          await page.setContent(userProfileTemplate);
+        } catch (error) {
+          await page.reload();
+          await page.setContent(userProfileTemplate);
+        }
+        await (0, _extendedTest.expect)((0, _.extractStructuredData)({
+          source: page,
+          dataSchema: {
+            type: "object",
+            properties: {
+              followers: {
+                type: "number"
+              },
+              following: {
+                type: "number"
+              }
+            },
+            required: ["followers", "following"]
+          },
+          prompt: getPromptVariation(sharedPrompts.domMatching),
+          enableDomMatching: true,
+          strategy: "HTML",
+          model: "claude-3-5-sonnet-20240620"
+        })).rejects.toThrow("For DOM matching, all types of the extraction fields must be STRINGS");
+      });
+    });
+    (0, _extendedTest.describe)("Caching with DOM Matching", () => {
+      (0, _extendedTest.test)("should use cached result when DOM matches", async () => {
+        await page.setContent(productListTemplate);
+        const schema = {
+          type: "object",
+          properties: {
+            title: {
+              type: "string"
+            },
+            price: {
+              type: "string"
+            }
+          },
+          required: ["title", "price"]
+        };
+        const firstResult = await (0, _.extractStructuredData)({
+          source: page.locator(".product").first(),
+          dataSchema: schema,
+          prompt: getPromptVariation(sharedPrompts.cachingBasic),
+          enableDomMatching: true,
+          strategy: "HTML",
+          model: "claude-3-5-sonnet-20240620",
+          apiKey: process.env.ANTHROPIC_API_KEY
+        });
+        const secondResult = await (0, _.extractStructuredData)({
+          source: page.locator(".product").first(),
+          dataSchema: schema,
+          prompt: getPromptVariation(sharedPrompts.cachingBasic),
+          enableDomMatching: true,
+          strategy: "HTML",
+          model: "claude-3-5-sonnet-20240620",
+          apiKey: process.env.ANTHROPIC_API_KEY
+        });
+        (0, _extendedTest.expect)(secondResult).toEqual(firstResult);
+      });
+      (0, _extendedTest.test)("should use cached result when DOM changes", async () => {
+        const schema = {
+          type: "object",
+          properties: {
+            title: {
+              type: "string"
+            },
+            price: {
+              type: "string"
+            }
+          },
+          required: ["title", "price"]
+        };
+        await page.setContent(productListTemplate);
+        const firstResult = await (0, _.extractStructuredData)({
+          source: page.locator(".product").first(),
+          dataSchema: schema,
+          prompt: getPromptVariation(sharedPrompts.cachingBasic),
+          enableDomMatching: true,
+          strategy: "HTML",
+          model: "claude-3-5-sonnet-20240620",
+          apiKey: process.env.ANTHROPIC_API_KEY
+        });
+        const modifiedTemplate = productListTemplate.replace("Water Resistant", "DOM HAS CHANGED BUT NOT THE PRICE OR TITLE");
+        await page.setContent(modifiedTemplate);
+        const secondResult = await (0, _.extractStructuredData)({
+          source: page.locator(".product").first(),
+          dataSchema: schema,
+          prompt: getPromptVariation(sharedPrompts.cachingBasic),
+          enableDomMatching: true,
+          strategy: "HTML",
+          model: "claude-3-5-sonnet-20240620",
+          apiKey: process.env.ANTHROPIC_API_KEY
+        });
+        (0, _extendedTest.expect)(secondResult).toEqual(firstResult);
+        (0, _extendedTest.expect)(secondResult.title).toBe("iPhone 14 Pro");
+        (0, _extendedTest.expect)(secondResult.price).toBe("$999");
+      });
+      (0, _extendedTest.test)("should not use cache when relevant DOM changes", async () => {
+        const schema = {
+          type: "object",
+          properties: {
+            title: {
+              type: "string"
+            },
+            price: {
+              type: "string"
+            }
+          },
+          required: ["title", "price"]
+        };
+        await page.setContent(productListTemplate);
+        const firstResult = await (0, _.extractStructuredData)({
+          source: page.locator(".product").first(),
+          dataSchema: schema,
+          prompt: getPromptVariation(sharedPrompts.cachingBasic),
+          enableDomMatching: true,
+          strategy: "HTML",
+          model: "claude-3-5-sonnet-20240620",
+          apiKey: process.env.ANTHROPIC_API_KEY
+        });
+        const modifiedTemplate = productListTemplate.replace("iPhone 14 Pro", "iPhone 15 Pro").replace("$999", "$1099");
+        await page.setContent(modifiedTemplate);
+        const secondResult = await (0, _.extractStructuredData)({
+          source: page.locator(".product").first(),
+          dataSchema: schema,
+          prompt: getPromptVariation(sharedPrompts.cachingBasic),
+          enableDomMatching: true,
+          strategy: "HTML",
+          model: "claude-3-5-sonnet-20240620",
+          apiKey: process.env.ANTHROPIC_API_KEY
+        });
+        (0, _extendedTest.expect)(secondResult).not.toEqual(firstResult);
+        (0, _extendedTest.expect)(secondResult.title).toBe("iPhone 15 Pro");
+        (0, _extendedTest.expect)(secondResult.price).toBe("$1099");
+      });
+    });
+    (0, _extendedTest.describe)("Caching without DOM Matching", () => {
+      (0, _extendedTest.test)("should use cached result regardless of DOM changes when matching is disabled", async () => {
+        const schema = {
+          type: "object",
+          properties: {
+            title: {
+              type: "string"
+            },
+            price: {
+              type: "string"
+            }
+          },
+          required: ["title", "price"]
+        };
+        await page.setContent(productListTemplate);
+        const firstResult = await (0, _.extractStructuredData)({
+          source: page.locator(".product").first(),
+          dataSchema: schema,
+          prompt: getPromptVariation(sharedPrompts.cachingBasic),
+          enableDomMatching: false,
+          strategy: "HTML",
+          model: "claude-3-5-sonnet-20240620",
+          apiKey: process.env.ANTHROPIC_API_KEY
+        });
+        const modifiedTemplate = productListTemplate.replace("iPhone 14 Pro", "iPhone 15 Pro").replace("$999", "$1099");
+        await page.setContent(modifiedTemplate);
+        const secondResult = await (0, _.extractStructuredData)({
+          source: page.locator(".product").first(),
+          dataSchema: schema,
+          prompt: getPromptVariation(sharedPrompts.cachingBasic),
+          enableDomMatching: false,
+          strategy: "HTML",
+          model: "claude-3-5-sonnet-20240620",
+          apiKey: process.env.ANTHROPIC_API_KEY
+        });
+        (0, _extendedTest.expect)(secondResult).not.toEqual(firstResult);
+        (0, _extendedTest.expect)(secondResult.title).toBe("iPhone 15 Pro");
+        (0, _extendedTest.expect)(secondResult.price).toBe("$1099");
+      });
+    });
+  });
+  (0, _extendedTest.describe)("Zod Schema Integration", () => {
+    (0, _extendedTest.test)("should extract data using Zod schema directly", async () => {
+      await page.setContent(productListTemplate);
+      const productZodSchema = _zod.z.object({
+        title: _zod.z.string().describe("Product name").optional(),
+        price: _zod.z.string().describe("Product price"),
+        stock: _zod.z.string().describe("Stock status"),
+        rating: _zod.z.string().describe("Product rating")
+      });
+      const data = await (0, _.extractStructuredData)({
+        source: page.locator(".product").first(),
+        dataSchema: productZodSchema,
+        prompt: "Extract prsoduct information including title, price, stock status, and rating",
+        enableDomMatching: true,
+        strategy: "HTML",
+        model: "claude-3-5-sonnet-20240620",
+        apiKey: process.env.ANTHROPIC_API_KEY
+      });
+      (0, _extendedTest.expect)(data).toHaveProperty("title", "iPhone 14 Pro");
+      (0, _extendedTest.expect)(data).toHaveProperty("price", "$999");
+      (0, _extendedTest.expect)(data).toHaveProperty("stock", "In Stock");
+      (0, _extendedTest.expect)(data).toHaveProperty("rating", "4.5");
+    });
+  });
+});