Update blog and script documentation for clarity and add new features

docs/src/content/docs/blog/creating-release-notes-with-genai.md

@@ -1,9 +1,17 @@
 ---
-title: "Creating Release Notes with GenAI"
+title: Creating Release Notes with GenAI
 date: 2024-08-26
-tags: ["genaiscript", "automation", "release notes"]
+tags:
+  - release notes
+  - automation
+  - scripting
+  - software development
+  - AI
 authors: genaiscript
 canonical_url: https://microsoft.github.io/genaiscript/blog/creating-release-notes-with-genai
+description: Learn how to automate the creation of engaging software release
+  notes using GenAI and GenAIScript.
+
 ---
 
 ## Automating Your Release Notes with GenAI

docs/src/content/docs/reference/scripts/browse.md → docs/src/content/docs/reference/scripts/browser.md

@@ -1,7 +1,15 @@
 ---
-title: Browse
+title: Browser Automation
 sidebar:
     order: 30
+description: Discover how GenAIScript integrates with Playwright for web
+    scraping and browser automation tasks.
+tags:
+    - GenAIScript
+    - Playwright
+    - web scraping
+    - automation
+    - browser
 ---
 
 GenAIScript provides a simplified API to interact with a headless browser using [Playwright](https://playwright.dev/) .
@@ -41,7 +49,7 @@ If you see this error message, you might have to install the dependencies manual
 
 ## `host.browse`
 
-This function launches a new browser instance and optionally navigates to the page.
+This function launches a new browser instance and optionally navigates to the page. The page are automatically closed when the script ends.
 
 ```js
 const page = await host.browse(url)
@@ -53,6 +61,47 @@ You can configure a number of options for the browser instance:
 const page = await host.browse(url, { incognito: true })
 ```
 
+## Locators
+
+You can select elements on the page using the `page.get...` or `page.locator` method.
+
+```js
+// select by Aria roles
+const button = page.getByRole("button")
+// select by test-id
+const table = page.getByTestId("csv-table")
+```
+
+## Element contents
+
+You can access `innerHTML`, `innerText`, `value` and `textContent` of an element.
+
+```js
+const table = page.getByTestId("csv-table")
+const html = table.innerHTML() // without the outer <table> tags!
+const text = table.innerText()
+const value = page.getByRole("input").value()
+```
+
+You can use the parsers in [HTML](/genaiscript/reference/scripts/html) to convert the HTML to Markdown.
+
+```js
+const md = HTML.convertToMarkdown(html)
+const text = HTML.convertToText(html)
+const tables = HTML.convertTablesToJSON(html)
+```
+
+## Screenshot
+
+You can take a screenshot of the current page or a locator and use it with vision-enabled LLM (like `gpt-4o`) using `defImages`.
+
+```js
+const screenshot = await page.screenshot() // returns a node.js Buffer
+defImages(screenshot)
+```
+
+## Interacting with Elements
+
 ## (Advanced) Native Playwright APIs
 
 The `page` instance returned is a native [Playwright Page](https://playwright.dev/docs/api/class-page) object.

docs/src/content/docs/reference/scripts/html.md

@@ -3,41 +3,42 @@ title: HTML
 description: Learn how to use HTML parsing functions in GenAIScript for effective content manipulation and data extraction.
 keywords: HTML parsing, content manipulation, data extraction, HTML to text, HTML to markdown
 sidebar:
-  order: 18
+    order: 18
 ---
 
-# HTML in GenAIScript
-
-HTML processing in GenAIScript enables you to manipulate and extract data from HTML content effectively. Below you can find guidelines on using the HTML-related APIs available in GenAIScript.
+HTML processing enables you to parse HTML content effectively. Below you can find guidelines on using the HTML-related APIs available in GenAIScript.
 
 ## Overview
 
 HTML processing functions allow you to convert HTML content to text or markdown, helping in content extraction and manipulation for various automation tasks.
 
-## API Reference
-
-### `HTMLToText`
+## `convertToText`
 
 Converts HTML content into plain text. This is useful for extracting readable text from web pages.
 
-#### Example
-
 ```js
-const htmlContent = "<p>Hello, world!</p>";
-const text = HTML.HTMLToText(htmlContent);
+const htmlContent = "<p>Hello, world!</p>"
+const text = HTML.HTMLToText(htmlContent)
 // Output will be: "Hello, world!"
 ```
 
-### `HTMLToMarkdown`
+## `convertToMarkdown`
 
 Converts HTML into Markdown format. This function is handy for content migration projects or when integrating web content into markdown-based systems.
 
-#### Example
-
 ```js
-const htmlContent = "<p>Hello, <strong>world</strong>!</p>";
-const markdown = HTML.HTMLToMarkdown(htmlContent);
+const htmlContent = "<p>Hello, <strong>world</strong>!</p>"
+const markdown = HTML.HTMLToMarkdown(htmlContent)
 // Output will be: "Hello, **world**!"
 ```
 
-For more details on related APIs, refer to the [GenAIScript documentation](https://microsoft.github.io/genaiscript/).
+## `convertTablesToJSON`
+
+This function specializes in extracting tables from HTML content and converting them into JSON format. It is useful for data extraction tasks from web pages.
+
+```js
+const tables = HTML.convertTablesToJSON(htmlContent)
+const table = tables[0]
+
+defData("DATA", table)
+```

packages/core/src/types/prompt_template.d.ts

@@ -2065,8 +2065,8 @@ interface ShellHost {
 
     /**
      * Starts a headless browser and navigates to the page.
-     * Requires to [install playwright and dependencies](https://microsoft.github.io/genaiscript/reference/scripts/browse).
-     * @link https://microsoft.github.io/genaiscript/reference/scripts/browse
+     * Requires to [install playwright and dependencies](https://microsoft.github.io/genaiscript/reference/scripts/browser).
+     * @link https://microsoft.github.io/genaiscript/reference/scripts/browser
      * @param url
      * @param options
      */

packages/sample/genaisrc/front-matter.genai.mjs

@@ -11,7 +11,13 @@ script({
 
 defFileMerge(function frontmatter(fn, label, before, generated) {
     if (!/\.mdx?$/i.test(fn)) return undefined
-    const updated = MD.updateFrontmatter(before, YAML.parse(generated))
+    const after = YAML.parse(generated)
+    if (after.tag && !Array.isArray(after.tag)) delete after.tag
+    const updated = MD.updateFrontmatter(before, {
+        title: after.title,
+        description: after.description,
+        keywords: after.keywords,
+    })
     return updated
 })