Browser add explaination and example

Author: Nursid

docs/api/browser/click.md

@@ -22,6 +22,32 @@ data:
  <CBParameters/>
 
  ### Examples
+
  ```js
- var a=1
- ```
+// Using Codebolt's browser API, you can interact with elements on a web page.
+// For example, let's say there's a button with the ID "test" on the page.
+// You can use Codebolt's browser API to click on this button.
+
+
+// First, let's imagine there's a button with the ID "test" on the web page.
+// <button id="test">Click me</button>
+
+// Now, you want to use Codebolt's browser API to click on this button.
+
+// The syntax for clicking an element with a specific ID using Codebolt's browser API is:
+// await codebolt.browser.click("elementSelector")
+
+// In this case, the element selector is "#test" because we are targeting an element with the ID "test".
+
+// Putting it all together:
+codebolt.browser.click("#test");
+
+ ```
+
+ ### Explaination 
+
+[Browser](../../concepts/browser)  Click function is used to click on the browser by selecting specific elementId.
+
+A browser is a used to access and display web pages on the internet. When a browser is open, users can interact with various elements on web pages, such as buttons, links, forms, and images.
+
+One common action in web development and automation is clicking on specific elements within a web page. This action is typically performed by selecting the element using its unique identifier, often referred to as the element ID, and then triggering a click event on that element.

docs/api/browser/close.md

@@ -16,6 +16,25 @@ data:
 <CBBaseInfo/> 
  <CBParameters/>
 
+### Examples
+ ```js
+ // Open the browser and navigate to a specific URL
+ codebolt.browser.goToPage(url);
+
+// Perform tests on the web page
+// (Assume you have performed all necessary tests)
+
+// Close the current page
+ codebolt.browser.close();
+
+ ```
+### Explaination
+
+Navigation: The script first opens a browser window/tab and navigates to the specified URL using codebolt.browser.goToPage(url). In this example, it navigates to "https://example.com".
+
+Testing: Once on the web page, the script performs various tests to validate the functionality of the application.
+
+Closing the Page: After completing the tests on the current page, the codebolt.browser.close() function is used to close the current page/tab. This action is useful for cleaning up after testing is complete and for ensuring that the browser environment is left in a desired state.
 
 
 

docs/api/browser/enter.md

@@ -16,4 +16,30 @@ data:
   link: enter.md
 ---
 <CBBaseInfo/> 
- <CBParameters/>
+ <CBParameters/>
+
+### Examples 
+
+```js
+
+// Navigate to the sign-in page
+await codebolt.browser.goToPage("https://example.com/signin");
+
+// Fill in the username field
+await codebolt.browser.type("#username", "your_username");
+
+// Fill in the password field
+await codebolt.browser.type("#password", "your_password");
+
+// Simulate pressing the Enter key to submit the form
+await codebolt.browser.enter();
+
+```
+
+### Explanation:
+
+Navigation: The script navigates to the sign-in page of the website.
+
+Entering Data: Using codebolt.browser.type(), the script fills in the username and password fields with the appropriate credentials.
+
+Simulating Enter Key Press: Instead of clicking a submit button, the script uses codebolt.browser.enter() to simulate pressing the Enter key. This action triggers the default submission behavior of the form, submitting the entered username and password for authentication.

docs/api/browser/extractText.md

@@ -14,4 +14,26 @@ data:
   link: extractText.md
 ---
 <CBBaseInfo/> 
- <CBParameters/>
+ <CBParameters/>
+
+### Examples: 
+
+```js
+// Navigate to the news website
+await codebolt.browser.goToPage("https://example-news.com");
+
+// Extract all text from the current page
+const pageText = await codebolt.browser.extractText();
+
+// Log the extracted text to the console (or process it as needed)
+console.log(pageText);
+
+```
+
+### Explaination: 
+
+Navigation: The script starts by navigating to the news website's homepage using codebolt.browser.goToPage("https://example-news.com").
+
+Text Extraction: Once the page has loaded, the script uses codebolt.browser.extractText() to extract all the text content from the current page. This function captures all textual information present on the web page, including headings, paragraphs, and any other text elements.
+
+Processing the Extracted Text: The extracted text is stored in the variable pageText. In this example, the script simply logs the extracted text to the console using console.log(pageText). In a real-world scenario, you might further process this text to analyze news headlines, summarize content, or extract specific information.

docs/api/browser/getContent.md

@@ -14,4 +14,30 @@ data:
   link: getContent.md
 ---
 <CBBaseInfo/> 
- <CBParameters/>
+ <CBParameters/>
+
+### Examples: 
+
+```js
+
+// Navigate to the blog page
+await codebolt.browser.goToPage("https://example-blog.com/article")
+
+// Retrieve the HTML content of the current page
+const pageContent = await codebolt.browser.getContent()
+
+// Log the retrieved content to the console (or save it as needed)
+console.log(pageContent)
+
+```
+
+### Explanation:
+The codebolt.browser.getContent() function is used to retrieve the entire HTML content of the current web page. This function is particularly useful in web scraping, data extraction, and automated testing scenarios where you need to capture the full structure and content of a web page for further processing or analysis.
+
+### Explaination of the code: 
+
+Navigation: The script begins by navigating to the specific blog page using codebolt.browser.goToPage("https://example-blog.com/article").
+
+Content Retrieval: Once the page has fully loaded, the script uses codebolt.browser.getContent() to retrieve the complete HTML content of the current page. This includes all HTML tags, embedded styles, scripts, and textual content.
+
+Processing the Retrieved Content: The retrieved HTML content is stored in the variable pageContent. In this example, the script logs the HTML content to the console using console.log(pageContent). In a real-world scenario, you might save this content to a file or a database for later analysis or offline access.

docs/api/browser/getHTML.md

@@ -16,4 +16,32 @@ data:
   link: getHTML.md
 ---
 <CBBaseInfo/> 
- <CBParameters/>
+ <CBParameters/>
+
+### Examples :
+
+```js
+
+// Navigate to the product page
+await codebolt.browser.goToPage("https://example-ecommerce.com/product/12345")
+
+// Retrieve the HTML content of the current page
+const htmlContent = await codebolt.browser.getHTML()
+
+// Log the retrieved HTML content to the console (or save it as needed)
+console.log(htmlContent)
+
+```
+
+### Explaination:
+
+The codebolt.browser.getHTML() function is used to retrieve the HTML content of the current web page. This function is particularly useful for web scraping, data extraction, and automated testing scenarios where you need to capture the entire HTML structure and content of a web page for further analysis or processing.
+
+
+### Explaination of the code: 
+
+Navigation: The script begins by navigating to the specific blog page using codebolt.browser.goToPage("https://example-blog.com/article").
+
+HTML Content Retrieval: Once the page has fully loaded, the script uses codebolt.browser.getHTML() to retrieve the complete HTML content of the current page. The function returns a promise that resolves to the HTML content, which includes all HTML tags, embedded styles, scripts, and textual content.
+
+Processing the Retrieved HTML: The retrieved HTML content is stored in the variable htmlContent. In this example, the script logs the HTML content to the console using console.log(htmlContent). Additionally, the example demonstrates how to save the HTML content to a file using Node.js's file system module (fs), which writes the HTML content to a file named product-page.html.

docs/api/browser/getMarkdown.md

@@ -16,4 +16,39 @@ data:
   link: getMarkdown.md
 ---
 <CBBaseInfo/> 
- <CBParameters/>
+ <CBParameters/>
+
+### Examples: 
+
+```js
+
+// Navigate to the blog post page
+await codebolt.browser.goToPage("https://example-blog.com/post/12345");
+
+// Retrieve the Markdown content of the current page
+const markdownContent = await codebolt.browser.getMarkdown();
+
+// Log the retrieved Markdown content to the console (or save it as needed)
+console.log(markdownContent);
+
+```
+
+
+### Explanation:
+
+The codebolt.browser.getMarkdown() function is used to retrieve the Markdown representation of the content on the current web page. This function is particularly useful for converting HTML content into a more readable and editable Markdown format, which is widely used in documentation, blogging, and content management systems.
+
+
+### Explanation of the Code
+
+Navigation: The script starts by navigating to a specific blog post page using codebolt.browser.goToPage("https://example-blog.com/post/12345").
+
+
+Markdown Content Retrieval: Once the page has fully loaded, the script uses codebolt.browser.getMarkdown() to retrieve the content of the current page in Markdown format. This function converts the HTML content into Markdown, capturing the structure and text in a more readable format.
+
+
+Processing the Retrieved Markdown: The retrieved Markdown content is stored in the variable markdownContent. In this example, the script logs the Markdown content to the console using console.log(markdownContent). Additionally, the example demonstrates how to save the Markdown content to a file using Node.js's file system module (fs), which writes the content to a file named post.md.
+
+
+
+

docs/api/browser/getPDF.md

@@ -14,4 +14,34 @@ data:
   link: getPDF.md
 ---
 <CBBaseInfo/> 
- <CBParameters/>
+ <CBParameters/>
+
+### Examples:
+
+```js
+
+// Navigate to the news article page
+await codebolt.browser.goToPage("https://example-news.com/article/12345");
+
+// Retrieve the PDF content of the current page
+const pdfContent = await codebolt.browser.getPDF();
+
+// Log a message to indicate the PDF has been retrieved (optional)
+console.log("PDF content retrieved successfully");
+
+```
+
+
+### Explanation
+
+The codebolt.browser.getPDF() function is used to retrieve a PDF representation of the current web page. This function is particularly useful for generating PDF versions of web pages for documentation, archiving, or sharing purposes. It captures the visual layout and content of the web page as a PDF file.
+
+
+
+### Explanation of the Code
+
+Navigation: The script starts by navigating to a specific news article page using codebolt.browser.goToPage("https://example-news.com/article/12345").
+
+PDF Content Retrieval: Once the page has fully loaded, the script uses codebolt.browser.getPDF() to retrieve the content of the current page as a PDF. This function captures the entire visual layout and content of the page, creating a PDF file that mirrors the web page's appearance.
+
+Processing the Retrieved PDF: The retrieved PDF content is stored in the variable pdfContent. In this example, the script logs a message to the console to indicate that the PDF has been successfully retrieved.

docs/api/browser/getUrl.md

@@ -16,4 +16,29 @@ data:
   link: getUrl.md
 ---
 <CBBaseInfo/> 
- <CBParameters/>
+ <CBParameters/>
+
+
+### Examples: 
+
+```js
+
+// Navigate to the home page
+await codebolt.browser.goToPage("https://example-website.com");
+
+// Retrieve and log the current URL
+let currentUrl = await codebolt.browser.getUrl();
+console.log(`Current URL: ${currentUrl}`);
+
+```
+
+### Explanation
+
+The codebolt.browser.getUrl() function is used to retrieve the URL of the current active page in the browser. This function is useful in web automation, testing, and navigation scenarios where you need to confirm or log the URL of the page that the browser is currently displaying.
+
+
+### Explanation of the Code
+Navigation to Home Page: The script begins by navigating to the home page of the website using codebolt.browser.goToPage("https://example-website.com").
+
+Retrieving the Current URL: After the page has loaded, the script uses codebolt.browser.getUrl() to retrieve the current URL of the browser's active page. The retrieved URL is stored in the variable currentUrl.
+

docs/api/browser/goToPage.md

@@ -19,4 +19,22 @@ data:
   link: goToPage.md
 ---
 <CBBaseInfo/> 
- <CBParameters/>
+ <CBParameters/>
+
+### Examples
+
+```js
+
+ //Navigate to a webpage using Codebolt's browser API
+await codebolt.browser.goToPage('https://docs.codebolt.ai/docs/api/browser/goToPage/')
+
+
+```
+
+### Explanation
+
+[browser](../../concepts/browser)  The codebolt.browser.goToPage(url) function is used to navigate the browser to a new web page specified by the URL provided. When this function is called, the browser leaves the current page and loads the new page indicated by the URL.
+
+
+
+

docs/api/browser/newPage.md

@@ -14,4 +14,15 @@ data:
   link: newPage.md
 ---
 <CBBaseInfo/> 
- <CBParameters/>
+ <CBParameters/>
+
+### Examples: 
+
+```js
+// Open a new page in the browser
+await codebolt.browser.newPage();
+
+```
+
+### Explanation
+The codebolt.browser.newPage() function is used to open a new tab or window in the browser. This function is useful in web automation, testing, and multi-page navigation scenarios where you need to interact with multiple pages simultaneously.

docs/api/browser/pdfToText.md

@@ -14,4 +14,19 @@ data:
   link: pdfToText.md
 ---
 <CBBaseInfo/> 
- <CBParameters/>
+ <CBParameters/>
+
+### Examples: 
+
+```js
+
+// Navigate to the page containing the PDF document
+await codebolt.browser.goToPage("https://example.com/report.pdf");
+
+// Convert the PDF content to text
+codebolt.browser.pdfToText();
+
+```
+
+### Explanation
+The codebolt.browser.pdfToText() function is used to convert the PDF content of the current page into text format. This function is particularly useful when dealing with PDF documents in web automation or data extraction scenarios where you need to extract textual information from PDF files.