@rickcedwhat/playwright-smart-table 2.1.0 → 2.1.2

package/README.md

@@ -8,46 +8,52 @@ This library abstracts away the complexity of testing dynamic web tables. It han
 
 npm install @rickcedwhat/playwright-smart-table
 
-
 Requires @playwright/test as a peer dependency.
 
 ⚡ Quick Start
 
-1. The Standard HTML Table
-
-For standard tables (<table>, <tr>, <td>), no configuration is needed.
+The Standard HTML Table
 
-import { test, expect } from '@playwright/test';
-import { useTable } from '@rickcedwhat/playwright-smart-table';
+For standard tables (<table>, <tr>, <td>), no configuration is needed (defaults work for most standard HTML tables).
 
-test('Verify User Email', async ({ page }) => {
-  const table = useTable(page.locator('#users-table'));
-  
-  // 🪄 Finds the row with Name="Alice", then gets the Email cell.
-  // If Alice is on Page 2, it handles pagination automatically.
-  const row = await table.getByRow({ Name: 'Alice' });
-  
-  await expect(row.getCell('Email')).toHaveText('alice@example.com');
+<!-- embed: quick-start -->
+```typescript
+const table = useTable(page.locator('#example'), {
+  headerSelector: 'thead th' // Override for this specific site
 });
 
+// 🪄 Finds the row with Name="Airi Satou", then gets the Position cell.
+// If Airi is on Page 2, it handles pagination automatically.
+const row = await table.getByRow({ Name: 'Airi Satou' });
 
-2. Complex Grids (Material UI / AG-Grid / Divs)
+await expect(row.getCell('Position')).toHaveText('Accountant');
+```
+<!-- /embed: quick-start -->
 
-For modern React grids, simply override the selectors and define a pagination strategy.
+Complex Grids (Material UI / AG-Grid / Divs)
 
-import { useTable, TableStrategies } from '@rickcedwhat/playwright-smart-table';
+For modern React grids, simply override the selectors and define a pagination strategy.
 
-const table = useTable(page.locator('.MuiDataGrid-root'), {
-  rowSelector: '.MuiDataGrid-row',
-  headerSelector: '.MuiDataGrid-columnHeader',
-  cellSelector: '.MuiDataGrid-cell',
+<!-- embed: pagination -->
+```typescript
+const table = useTable(page.locator('#example'), {
+  rowSelector: 'tbody tr',
+  headerSelector: 'thead th',
+  cellSelector: 'td',
   // Strategy: Tell it how to find the next page
-  pagination: TableStrategies.clickNext(
-    // Use 'page' to find buttons outside the table container
-    (root) => root.page().getByRole('button', { name: 'Go to next page' })
-  )
+  pagination: TableStrategies.clickNext(() => 
+    page.getByRole('link', { name: 'Next' })
+  ),
+  maxPages: 5 // Allow scanning up to 5 pages
 });
 
+// ✅ Verify Colleen is NOT visible initially
+await expect(page.getByText("Colleen Hurst")).not.toBeVisible();
+
+await expect(await table.getByRow({ Name: "Colleen Hurst" })).toBeVisible();
+// NOTE: We're now on the page where Colleen Hurst exists (typically Page 2)
+```
+<!-- /embed: pagination -->
 
 🧠 SmartRow Pattern
 
@@ -55,25 +61,65 @@ The core power of this library is the SmartRow.
 
 Unlike a standard Playwright Locator, a SmartRow is aware of its context within the table's schema. It extends the standard Locator API, so you can chain standard Playwright methods (.click(), .isVisible()) directly off it.
 
-getCell(columnName)
-
-Instead of writing brittle nth-child selectors, ask for the column by name.
+<!-- embed: smart-row -->
+```typescript
+// 1. Get SmartRow via getByRow
+const row = await table.getByRow({ Name: 'Airi Satou' });
 
+// 2. Interact with cell (No more getByCell needed!)
 // ✅ Good: Resilient to column reordering
-await row.getCell('Email').click(); 
+await row.getCell('Position').click();
+
+// 3. Dump data from row
+const data = await row.toJSON();
+console.log(data);
+// { Name: "Airi Satou", Position: "Accountant", ... }
+```
+<!-- /embed: smart-row -->
+
+🚀 Advanced Usage
 
-// ❌ Bad: Brittle
-await row.locator('td').nth(2).click(); 
+🔎 Debug Mode
 
+Having trouble finding rows? Enable debug mode to see exactly what the library sees (headers mapped, rows scanned, pagination triggers).
 
-toJSON()
+<!-- embed: advanced-debug -->
+```typescript
+const table = useTable(page.locator('#example'), {
+  headerSelector: 'thead th',
+  debug: true 
+});
+```
+<!-- /embed: advanced-debug -->
 
-Extracts the entire row's data into a clean key-value object.
+🔄 Resetting State
 
-const data = await row.toJSON();
-console.log(data); 
-// { Name: "Alice", Role: "Admin", Status: "Active" }
+If your tests navigate deep into a table (e.g., Page 5), subsequent searches might fail. Use .reset() to return to the start.
+
+<!-- embed: advanced-reset -->
+```typescript
+// Navigate deep into the table (simulated by finding a row on page 2)
+// For the test to pass, we need a valid row. 'Angelica Ramos' is usually on page 1 or 2 depending on sorting.
+try {
+  await table.getByRow({ Name: 'Angelica Ramos' });
+} catch (e) {}
+
+// Reset internal state (and potentially UI) to Page 1
+await table.reset();
+```
+<!-- /embed: advanced-reset -->
+
+📊 Column Scanning
 
+Need to verify a specific column is sorted or contains specific data? Use getColumnValues for a high-performance scan.
+
+<!-- embed: advanced-column-scan -->
+```typescript
+// Quickly grab all text values from the "Office" column
+const offices = await table.getColumnValues('Office'); 
+expect(offices).toContain('Tokyo');
+```
+<!-- /embed: advanced-column-scan -->
 
 📖 API Reference
 
@@ -87,13 +133,16 @@ Returns Sentinel if 0 rows match (allows not.toBeVisible() assertions).
 
 Auto-Paginates if the row isn't found on the current page.
 
-// Find a row where Name is "Alice" AND Role is "Admin"
-const row = await table.getByRow({ Name: "Alice", Role: "Admin" });
+<!-- embed: get-by-row -->
+```typescript
+// Find a row where Name is "Airi Satou" AND Office is "Tokyo"
+const row = await table.getByRow({ Name: "Airi Satou", Office: "Tokyo" });
 await expect(row).toBeVisible();
 
 // Assert it does NOT exist
-await expect(await table.getByRow({ Name: "Ghost" })).not.toBeVisible();
-
+await expect(await table.getByRow({ Name: "Ghost User" })).not.toBeVisible();
+```
+<!-- /embed: get-by-row -->
 
 getAllRows(options?)
 
@@ -103,19 +152,22 @@ Returns: Array of SmartRow objects.
 
 Best for: Checking existence ("at least one") or validating sort order.
 
+<!-- embed: get-all-rows -->
+```typescript
 // 1. Get ALL rows on the current page
 const allRows = await table.getAllRows();
 
 // 2. Get subset of rows (Filtering)
-const activeUsers = await table.getAllRows({ 
-  filter: { Status: 'Active' } 
+const tokyoUsers = await table.getAllRows({
+  filter: { Office: 'Tokyo' }
 });
-expect(activeUsers.length).toBeGreaterThan(0); // "At least one active user"
+expect(tokyoUsers.length).toBeGreaterThan(0);
 
 // 3. Dump data to JSON
 const data = await table.getAllRows({ asJSON: true });
-console.log(data); // [{ Name: "Alice", Status: "Active" }, ...]
-
+console.log(data); // [{ Name: "Airi Satou", ... }, ...]
+```
+<!-- /embed: get-all-rows -->
 
 🧩 Pagination Strategies
 
@@ -123,44 +175,17 @@ This library uses the Strategy Pattern to handle navigation. You can use the bui
 
 Built-in Strategies
 
-clickNext(selector)
-Best for standard tables (Datatables, lists). Clicks a button and waits for data to change.
+clickNext(selector) Best for standard tables (Datatables, lists). Clicks a button and waits for data to change.
 
-pagination: TableStrategies.clickNext((root) => 
-  root.page().getByRole('button', { name: 'Next' })
+pagination: TableStrategies.clickNext((root) =>
+root.page().getByRole('button', { name: 'Next' })
 )
 
-
-infiniteScroll()
-Best for Virtualized Grids (AG-Grid, HTMX). Aggressively scrolls to trigger data loading.
+infiniteScroll() Best for Virtualized Grids (AG-Grid, HTMX). Aggressively scrolls to trigger data loading.
 
 pagination: TableStrategies.infiniteScroll()
 
-
-clickLoadMore(selector)
-Best for "Load More" buttons. Clicks and waits for row count to increase.
-
-Writing Custom Strategies
-
-A Strategy is just a function that receives the table context and returns a Promise<boolean> (true if navigation happened, false if we reached the end).
-
-import { PaginationStrategy } from '@rickcedwhat/playwright-smart-table';
-
-const myCustomStrategy: PaginationStrategy = async ({ root, page, config }) => {
-  // 1. Check if we can navigate
-  const nextBtn = page.getByTestId('custom-next-arrow');
-  if (!await nextBtn.isVisible()) return false;
-
-  // 2. Perform Navigation
-  await nextBtn.click();
-
-  // 3. Smart Wait (Crucial!)
-  // Wait for a loading spinner to disappear, or data to change
-  await expect(page.locator('.spinner')).not.toBeVisible();
-  
-  return true; // We successfully moved to the next page
-};
-
+clickLoadMore(selector) Best for "Load More" buttons. Clicks and waits for row count to increase.
 
 🛠️ Developer Tools
 
@@ -170,12 +195,11 @@ generateConfigPrompt(options?)
 
 Prints a prompt you can paste into ChatGPT/Gemini to generate the TableConfig for your specific HTML.
 
-// Options: 'console' (default), 'report' (Playwright HTML Report), 'file'
-await table.generateConfigPrompt({ output: 'report' });
-
+// Options: 'console' (default), 'error' (Throw error to see prompt in trace/cloud)
+await table.generateConfigPrompt({ output: 'console' });
 
 generateStrategyPrompt(options?)
 
 Prints a prompt to help you write a custom Pagination Strategy.
 
-await table.generateStrategyPrompt({ output: 'console' });
+await table.generateStrategyPrompt({ output: 'console' });

package/dist/strategies/index.js

@@ -34,20 +34,40 @@ exports.TableStrategies = {
     clickNext: (nextButtonSelector, timeout = 5000) => {
         return (_a) => __awaiter(void 0, [_a], void 0, function* ({ root, config, resolve, page }) {
             const nextBtn = resolve(nextButtonSelector, root).first();
-            // Check if button exists/enabled before clicking
-            if (!(yield nextBtn.isVisible()) || !(yield nextBtn.isEnabled())) {
+            // Debug log (can be verbose, maybe useful for debugging only)
+            // console.log(`[Strategy: clickNext] Checking button...`);
+            // Check if button exists/enabled before clicking.
+            // We do NOT wait here because if the button isn't visible/enabled, 
+            // we assume we reached the last page.
+            if (!(yield nextBtn.isVisible())) {
+                console.log(`[Strategy: clickNext] Button not visible. Stopping pagination.`);
+                return false;
+            }
+            if (!(yield nextBtn.isEnabled())) {
+                console.log(`[Strategy: clickNext] Button disabled. Stopping pagination.`);
                 return false;
             }
             // 1. Snapshot current state
             const firstRow = resolve(config.rowSelector, root).first();
             const oldText = yield firstRow.innerText().catch(() => "");
             // 2. Click
-            yield nextBtn.click();
-            // 3. Smart Wait (Polling) - No 'expect' needed
-            return yield waitForCondition(() => __awaiter(void 0, void 0, void 0, function* () {
+            console.log(`[Strategy: clickNext] Clicking next button...`);
+            try {
+                yield nextBtn.click({ timeout: 2000 });
+            }
+            catch (e) {
+                console.warn(`[Strategy: clickNext] Click failed (blocked or detached): ${e}`);
+                return false;
+            }
+            // 3. Smart Wait (Polling)
+            const success = yield waitForCondition(() => __awaiter(void 0, void 0, void 0, function* () {
                 const newText = yield firstRow.innerText().catch(() => "");
                 return newText !== oldText;
             }), timeout, page);
+            if (!success) {
+                console.warn(`[Strategy: clickNext] Warning: Table content did not change after clicking Next.`);
+            }
+            return success;
         });
     },
     /**

package/dist/typeContext.d.ts

@@ -3,4 +3,4 @@
  * This file is generated by scripts/embed-types.js
  * It contains the raw text of types.ts to provide context for LLM prompts.
  */
-export declare const TYPE_CONTEXT = "\nexport type Selector = string | ((root: Locator | Page) => Locator);\n\nexport type SmartRow = Locator & {\n  getCell(column: string): Locator;\n  toJSON(): Promise<Record<string, string>>;\n};\n\nexport interface TableContext {\n  root: Locator;\n  config: Required<TableConfig>;\n  page: Page;\n  resolve: (selector: Selector, parent: Locator | Page) => Locator;\n}\n\nexport type PaginationStrategy = (context: TableContext) => Promise<boolean>;\n\nexport interface PromptOptions {\n  /**\n   * Output Strategy:\n   * - 'error': Throws an error with the prompt (Best for Cloud/QA Wolf to get clean text).\n   * - 'console': Standard console logs (Default).\n   */\n  output?: 'console' | 'error';\n  includeTypes?: boolean;\n}\n\nexport interface TableConfig {\n  rowSelector?: Selector;\n  headerSelector?: Selector;\n  cellSelector?: Selector;\n  pagination?: PaginationStrategy;\n  maxPages?: number;\n  /**\n   * Hook to rename columns dynamically.\n   * * @param args.text - The default innerText of the header.\n   * @param args.index - The column index.\n   * @param args.locator - The specific header cell locator.\n   */\n  headerTransformer?: (args: { text: string, index: number, locator: Locator }) => string | Promise<string>;\n  autoScroll?: boolean;\n}\n\nexport interface TableResult {\n  getHeaders: () => Promise<string[]>;\n  getHeaderCell: (columnName: string) => Promise<Locator>;\n\n  getByRow: <T extends { asJSON?: boolean }>(\n    filters: Record<string, string | RegExp | number>, \n    options?: { exact?: boolean, maxPages?: number } & T\n  ) => Promise<T['asJSON'] extends true ? Record<string, string> : SmartRow>;\n\n  getAllRows: <T extends { asJSON?: boolean }>(\n    options?: { filter?: Record<string, any>, exact?: boolean } & T\n  ) => Promise<T['asJSON'] extends true ? Record<string, string>[] : SmartRow[]>;\n\n  generateConfigPrompt: (options?: PromptOptions) => Promise<void>;\n  generateStrategyPrompt: (options?: PromptOptions) => Promise<void>;\n}\n";
+export declare const TYPE_CONTEXT = "\nexport type Selector = string | ((root: Locator | Page) => Locator);\n\nexport type SmartRow = Locator & {\n  getCell(column: string): Locator;\n  toJSON(): Promise<Record<string, string>>;\n};\n\nexport interface TableContext {\n  root: Locator;\n  config: Required<TableConfig>;\n  page: Page;\n  resolve: (selector: Selector, parent: Locator | Page) => Locator;\n}\n\nexport type PaginationStrategy = (context: TableContext) => Promise<boolean>;\n\nexport interface PromptOptions {\n  /**\n   * Output Strategy:\n   * - 'error': Throws an error with the prompt (Best for Cloud/QA Wolf to get clean text).\n   * - 'console': Standard console logs (Default).\n   */\n  output?: 'console' | 'error';\n  includeTypes?: boolean;\n}\n\nexport interface TableConfig {\n  rowSelector?: Selector;\n  headerSelector?: Selector;\n  cellSelector?: Selector;\n  pagination?: PaginationStrategy;\n  maxPages?: number;\n  /**\n   * Hook to rename columns dynamically.\n   * * @param args.text - The default innerText of the header.\n   * @param args.index - The column index.\n   * @param args.locator - The specific header cell locator.\n   */\n  headerTransformer?: (args: { text: string, index: number, locator: Locator }) => string | Promise<string>;\n  autoScroll?: boolean;\n  /**\n   * Enable debug mode to log internal state to console.\n   */\n  debug?: boolean;\n  /**\n   * Strategy to reset the table to the first page.\n   * Called when table.reset() is invoked.\n   */\n  onReset?: (context: TableContext) => Promise<void>;\n}\n\nexport interface TableResult {\n  getHeaders: () => Promise<string[]>;\n  getHeaderCell: (columnName: string) => Promise<Locator>;\n\n  getByRow: <T extends { asJSON?: boolean }>(\n    filters: Record<string, string | RegExp | number>, \n    options?: { exact?: boolean, maxPages?: number } & T\n  ) => Promise<T['asJSON'] extends true ? Record<string, string> : SmartRow>;\n\n  getAllRows: <T extends { asJSON?: boolean }>(\n    options?: { filter?: Record<string, any>, exact?: boolean } & T\n  ) => Promise<T['asJSON'] extends true ? Record<string, string>[] : SmartRow[]>;\n\n  generateConfigPrompt: (options?: PromptOptions) => Promise<void>;\n  generateStrategyPrompt: (options?: PromptOptions) => Promise<void>;\n\n  /**\n   * Resets the table state (clears cache, flags) and invokes the onReset strategy.\n   */\n  reset: () => Promise<void>;\n\n  /**\n   * Scans a specific column across all pages and returns the values.\n   */\n  getColumnValues: <V = string>(column: string, options?: { mapper?: (cell: Locator) => Promise<V> | V, maxPages?: number }) => Promise<V[]>;\n}\n";

package/dist/typeContext.js

@@ -47,6 +47,15 @@ export interface TableConfig {
    */
   headerTransformer?: (args: { text: string, index: number, locator: Locator }) => string | Promise<string>;
   autoScroll?: boolean;
+  /**
+   * Enable debug mode to log internal state to console.
+   */
+  debug?: boolean;
+  /**
+   * Strategy to reset the table to the first page.
+   * Called when table.reset() is invoked.
+   */
+  onReset?: (context: TableContext) => Promise<void>;
 }
 
 export interface TableResult {
@@ -64,5 +73,15 @@ export interface TableResult {
 
   generateConfigPrompt: (options?: PromptOptions) => Promise<void>;
   generateStrategyPrompt: (options?: PromptOptions) => Promise<void>;
+
+  /**
+   * Resets the table state (clears cache, flags) and invokes the onReset strategy.
+   */
+  reset: () => Promise<void>;
+
+  /**
+   * Scans a specific column across all pages and returns the values.
+   */
+  getColumnValues: <V = string>(column: string, options?: { mapper?: (cell: Locator) => Promise<V> | V, maxPages?: number }) => Promise<V[]>;
 }
 `;

package/dist/types.d.ts

@@ -38,6 +38,15 @@ export interface TableConfig {
         locator: Locator;
     }) => string | Promise<string>;
     autoScroll?: boolean;
+    /**
+     * Enable debug mode to log internal state to console.
+     */
+    debug?: boolean;
+    /**
+     * Strategy to reset the table to the first page.
+     * Called when table.reset() is invoked.
+     */
+    onReset?: (context: TableContext) => Promise<void>;
 }
 export interface TableResult {
     getHeaders: () => Promise<string[]>;
@@ -56,4 +65,15 @@ export interface TableResult {
     } & T) => Promise<T['asJSON'] extends true ? Record<string, string>[] : SmartRow[]>;
     generateConfigPrompt: (options?: PromptOptions) => Promise<void>;
     generateStrategyPrompt: (options?: PromptOptions) => Promise<void>;
+    /**
+     * Resets the table state (clears cache, flags) and invokes the onReset strategy.
+     */
+    reset: () => Promise<void>;
+    /**
+     * Scans a specific column across all pages and returns the values.
+     */
+    getColumnValues: <V = string>(column: string, options?: {
+        mapper?: (cell: Locator) => Promise<V> | V;
+        maxPages?: number;
+    }) => Promise<V[]>;
 }

package/dist/useTable.js

@@ -12,7 +12,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.useTable = void 0;
 const typeContext_1 = require("./typeContext");
 const useTable = (rootLocator, configOptions = {}) => {
-    const config = Object.assign({ rowSelector: "tbody tr", headerSelector: "th", cellSelector: "td", pagination: () => __awaiter(void 0, void 0, void 0, function* () { return false; }), maxPages: 1, headerTransformer: ({ text, index, locator }) => text, autoScroll: true }, configOptions);
+    const config = Object.assign({ rowSelector: "tbody tr", headerSelector: "th", cellSelector: "td", pagination: () => __awaiter(void 0, void 0, void 0, function* () { return false; }), maxPages: 1, headerTransformer: ({ text, index, locator }) => text, autoScroll: true, debug: false, onReset: () => __awaiter(void 0, void 0, void 0, function* () { console.warn("⚠️ .reset() called but no 'onReset' strategy defined in config."); }) }, configOptions);
     const resolve = (item, parent) => {
         if (typeof item === 'string')
             return parent.locator(item);
@@ -20,10 +20,17 @@ const useTable = (rootLocator, configOptions = {}) => {
             return item(parent);
         return item;
     };
+    // Internal State
     let _headerMap = null;
+    let _hasPaginated = false;
+    const logDebug = (msg) => {
+        if (config.debug)
+            console.log(`🔎 [SmartTable Debug] ${msg}`);
+    };
     const _getMap = () => __awaiter(void 0, void 0, void 0, function* () {
         if (_headerMap)
             return _headerMap;
+        logDebug('Mapping headers...');
         if (config.autoScroll) {
             try {
                 yield rootLocator.scrollIntoViewIfNeeded({ timeout: 1000 });
@@ -37,7 +44,7 @@ const useTable = (rootLocator, configOptions = {}) => {
         catch (e) { /* Ignore hydration */ }
         // 1. Fetch data efficiently
         const texts = yield headerLoc.allInnerTexts();
-        const locators = yield headerLoc.all(); // Need specific locators for the transformer
+        const locators = yield headerLoc.all();
         // 2. Map Headers (Async)
         const entries = yield Promise.all(texts.map((t, i) => __awaiter(void 0, void 0, void 0, function* () {
             let text = t.trim() || `__col_${i}`;
@@ -51,6 +58,7 @@ const useTable = (rootLocator, configOptions = {}) => {
             return [text, i];
         })));
         _headerMap = new Map(entries);
+        logDebug(`Mapped ${entries.length} columns: ${JSON.stringify(entries.map(e => e[0]))}`);
         return _headerMap;
     });
     const _makeSmart = (rowLocator, map) => {
@@ -99,15 +107,18 @@ const useTable = (rootLocator, configOptions = {}) => {
         const map = yield _getMap();
         const effectiveMaxPages = (_a = options.maxPages) !== null && _a !== void 0 ? _a : config.maxPages;
         let currentPage = 1;
+        logDebug(`Looking for row: ${JSON.stringify(filters)} (MaxPages: ${effectiveMaxPages})`);
         while (true) {
             const allRows = resolve(config.rowSelector, rootLocator);
             const matchedRows = _applyFilters(allRows, filters, map, options.exact || false);
             const count = yield matchedRows.count();
+            logDebug(`Page ${currentPage}: Found ${count} matches.`);
             if (count > 1)
                 throw new Error(`Strict Mode Violation: Found ${count} rows matching ${JSON.stringify(filters)}.`);
             if (count === 1)
                 return matchedRows.first();
             if (currentPage < effectiveMaxPages) {
+                logDebug(`Page ${currentPage}: Not found. Attempting pagination...`);
                 const context = {
                     root: rootLocator,
                     config: config,
@@ -116,9 +127,16 @@ const useTable = (rootLocator, configOptions = {}) => {
                 };
                 const didLoadMore = yield config.pagination(context);
                 if (didLoadMore) {
+                    _hasPaginated = true;
                     currentPage++;
                     continue;
                 }
+                else {
+                    logDebug(`Page ${currentPage}: Pagination failed (end of data).`);
+                }
+            }
+            if (_hasPaginated) {
+                console.warn(`⚠️ [SmartTable] Row not found. The table has been paginated (Current Page: ${currentPage}). You may need to call 'await table.reset()' if the target row is on a previous page.`);
             }
             return null;
         }
@@ -135,6 +153,34 @@ const useTable = (rootLocator, configOptions = {}) => {
         }
         console.log(finalPrompt);
     });
+    // Helper to extract clean HTML for prompts
+    const _getCleanHtml = (loc) => __awaiter(void 0, void 0, void 0, function* () {
+        return loc.evaluate((el) => {
+            const clone = el.cloneNode(true);
+            // 1. Remove Heavy/Useless Elements
+            const removeSelectors = 'script, style, svg, path, circle, rect, noscript, [hidden]';
+            clone.querySelectorAll(removeSelectors).forEach(n => n.remove());
+            // 2. Clean Attributes
+            const walker = document.createTreeWalker(clone, NodeFilter.SHOW_ELEMENT);
+            let currentNode = walker.currentNode;
+            while (currentNode) {
+                currentNode.removeAttribute('style'); // Inline styles are noise
+                currentNode.removeAttribute('data-reactid');
+                // 3. Condense Tailwind Classes (Heuristic)
+                // If class string is very long (>50 chars), keep the first few tokens and truncate.
+                // This preserves "MuiRow" but cuts "text-sm p-4 hover:bg-gray-50 ..."
+                const cls = currentNode.getAttribute('class');
+                if (cls && cls.length > 80) {
+                    const tokens = cls.split(' ');
+                    if (tokens.length > 5) {
+                        currentNode.setAttribute('class', tokens.slice(0, 4).join(' ') + ' ...');
+                    }
+                }
+                currentNode = walker.nextNode();
+            }
+            return clone.outerHTML;
+        });
+    });
     return {
         getHeaders: () => __awaiter(void 0, void 0, void 0, function* () { return Array.from((yield _getMap()).keys()); }),
         getHeaderCell: (columnName) => __awaiter(void 0, void 0, void 0, function* () {
@@ -144,6 +190,52 @@ const useTable = (rootLocator, configOptions = {}) => {
                 throw new Error(`Column '${columnName}' not found.`);
             return resolve(config.headerSelector, rootLocator).nth(idx);
         }),
+        reset: () => __awaiter(void 0, void 0, void 0, function* () {
+            logDebug("Resetting table...");
+            const context = {
+                root: rootLocator,
+                config: config,
+                page: rootLocator.page(),
+                resolve: resolve
+            };
+            yield config.onReset(context);
+            _hasPaginated = false;
+            _headerMap = null;
+            logDebug("Table reset complete.");
+        }),
+        getColumnValues: (column, options) => __awaiter(void 0, void 0, void 0, function* () {
+            var _a, _b;
+            const map = yield _getMap();
+            const colIdx = map.get(column);
+            if (colIdx === undefined)
+                throw new Error(`Column '${column}' not found.`);
+            const mapper = (_a = options === null || options === void 0 ? void 0 : options.mapper) !== null && _a !== void 0 ? _a : ((c) => c.innerText());
+            const effectiveMaxPages = (_b = options === null || options === void 0 ? void 0 : options.maxPages) !== null && _b !== void 0 ? _b : config.maxPages;
+            let currentPage = 1;
+            const results = [];
+            logDebug(`Getting column values for '${column}' (Pages: ${effectiveMaxPages})`);
+            while (true) {
+                const rows = yield resolve(config.rowSelector, rootLocator).all();
+                for (const row of rows) {
+                    const cell = typeof config.cellSelector === 'string'
+                        ? row.locator(config.cellSelector).nth(colIdx)
+                        : resolve(config.cellSelector, row).nth(colIdx);
+                    results.push(yield mapper(cell));
+                }
+                if (currentPage < effectiveMaxPages) {
+                    const context = {
+                        root: rootLocator, config, page: rootLocator.page(), resolve
+                    };
+                    if (yield config.pagination(context)) {
+                        _hasPaginated = true;
+                        currentPage++;
+                        continue;
+                    }
+                }
+                break;
+            }
+            return results;
+        }),
         getByRow: (filters, options) => __awaiter(void 0, void 0, void 0, function* () {
             let row = yield _findRowLocator(filters, options);
             if (!row) {
@@ -169,17 +261,51 @@ const useTable = (rootLocator, configOptions = {}) => {
             return smartRows;
         }),
         generateConfigPrompt: (options) => __awaiter(void 0, void 0, void 0, function* () {
-            const html = yield rootLocator.evaluate((el) => el.outerHTML);
+            const html = yield _getCleanHtml(rootLocator);
             const separator = "=".repeat(50);
-            const content = `\n${separator}\n🤖 COPY INTO GEMINI/ChatGPT 🤖\n${separator}\nI am using 'playwright-smart-table'. Generate config for:\n\`\`\`html\n${html.substring(0, 5000)} ...\n\`\`\`\n${separator}\n`;
+            const content = `\n${separator}\n🤖 COPY INTO GEMINI/ChatGPT 🤖\n${separator}\nI am using 'playwright-smart-table'. Generate config for:\n\`\`\`html\n${html.substring(0, 10000)} ...\n\`\`\`\n${separator}\n`;
             yield _handlePrompt('Smart Table Config', content, options);
         }),
         generateStrategyPrompt: (options) => __awaiter(void 0, void 0, void 0, function* () {
             const container = rootLocator.locator('xpath=..');
-            const html = yield container.evaluate((el) => el.outerHTML);
-            const content = `\n==================================================\n🤖 COPY INTO GEMINI/ChatGPT TO WRITE A STRATEGY 🤖\n==================================================\nI need a custom Pagination Strategy for 'playwright-smart-table'.\nContainer HTML:\n\`\`\`html\n${html.substring(0, 5000)} ...\n\`\`\`\n`;
+            const html = yield _getCleanHtml(container);
+            const content = `\n==================================================\n🤖 COPY INTO GEMINI/ChatGPT TO WRITE A STRATEGY 🤖\n==================================================\nI need a custom Pagination Strategy for 'playwright-smart-table'.\nContainer HTML:\n\`\`\`html\n${html.substring(0, 10000)} ...\n\`\`\`\n`;
             yield _handlePrompt('Smart Table Strategy', content, options);
-        })
+        }),
+        /* * 🚧 ROADMAP (v2.2) 🚧
+         * The following features are planned. Implementations are tentative.
+         * DO NOT DELETE THIS SECTION UNTIL IMPLEMENTED OR REMOVED.
+         * THIS IS BEING USED TO TRACK FUTURE DEVELOPMENT.
+         */
+        // __roadmap__fill: async (data: Record<string, any>) => {
+        //   /* //    * Goal: Fill a row with data intelligently.
+        //    * Priority: Medium
+        //    * Challenge: Handling different input types (select, checkbox, custom divs) blindly.
+        //    */
+        //    // const row = ... get row context ...
+        //    // for (const [col, val] of Object.entries(data)) {
+        //    //    const cell = row.getCell(col);
+        //    //    const input = cell.locator('input, select, [role="checkbox"]');
+        //    //    if (await input.count() > 1) console.warn("Ambiguous input");
+        //    //    // Heuristics go here...
+        //    // }
+        //    // Note: Maybe we could pass the locator in the options for more control.
+        // },
+        // __roadmap__auditPages: async (options: { maxPages: number, audit: (rows: SmartRow[], page: number) => Promise<void> }) => {
+        //   /*
+        //    * Goal: Walk through pages and run a verification function on every page.
+        //    * Priority: Low (Specific use case)
+        //    * Logic:
+        //    * let page = 1;
+        //    * while (page <= options.maxPages) {
+        //    * const rows = await getAllRows();
+        //    * await options.audit(rows, page);
+        //    * if (!await pagination(ctx)) break;
+        //    * page++;
+        //    * }
+        //    */
+        //    // Note: Maybe make is possible to skip several pages at once if the pagination strategy supports it.
+        // }
     };
 };
 exports.useTable = useTable;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rickcedwhat/playwright-smart-table",
-  "version": "2.1.0",
+  "version": "2.1.2",
   "description": "A smart table utility for Playwright with built-in pagination strategies that are fully extensible.",
   "repository": {
     "type": "git",
@@ -13,9 +13,11 @@
   ],
   "scripts": {
     "generate-types": "node scripts/embed-types.mjs",
-    "build": "npm run generate-types && tsc",
+    "generate-docs": "node scripts/generate-readme.mjs",
+    "build": "npm run generate-types && npm run generate-docs && tsc",
     "prepublishOnly": "npm run build",
-    "test": "npx playwright test"
+    "test": "npx playwright test",
+    "prepare": "husky install"
   },
   "keywords": [
     "playwright",
@@ -37,6 +39,7 @@
     "@playwright/test": "^1.50.0",
     "@types/node": "^20.0.0",
     "ts-node": "^10.9.0",
-    "typescript": "^5.0.0"
+    "typescript": "^5.0.0",
+    "husky": "^8.0.0"
   }
 }