docs(browser): add render libraries examples (#9325)

Author: sheremet-va

docs/.vitepress/config.ts

@@ -594,24 +594,6 @@ export default ({ mode }: { mode: string }) => {
                   },
                 ],
               },
-              // {
-              //   text: 'Render Function',
-              //   collapsed: true,
-              //   items: [
-              //     {
-              //       text: 'react',
-              //       link: '/config/browser/react',
-              //     },
-              //     {
-              //       text: 'vue',
-              //       link: '/config/browser/vue',
-              //     },
-              //     {
-              //       text: 'svelte',
-              //       link: '/config/browser/svelte',
-              //     },
-              //   ],
-              // },
               {
                 text: 'browser.enabled',
                 link: '/config/browser/enabled',
@@ -1007,6 +989,28 @@ export default ({ mode }: { mode: string }) => {
           {
             text: 'Browser Mode',
             items: [
+              {
+                text: 'Render Function',
+                collapsed: false,
+                items: [
+                  {
+                    text: 'react',
+                    link: '/api/browser/react',
+                  },
+                  {
+                    text: 'vue',
+                    link: '/api/browser/vue',
+                  },
+                  {
+                    text: 'svelte',
+                    link: '/api/browser/svelte',
+                  },
+                  // {
+                  //   text: 'angular',
+                  //   link: '/api/browser/angular',
+                  // },
+                ],
+              },
               {
                 text: 'Context',
                 link: '/api/browser/context',

docs/api/browser/locators.md

@@ -830,6 +830,10 @@ This method returns a single element matching the locator's selector or `null` i
 
 If multiple elements match the selector, this method will throw an error.  Use [`.elements()`](#elements) when you need all matching DOM Elements or [`.all()`](#all) if you need an array of locators matching the selector.
 
+::: danger
+This is an escape hatch for external APIs that do not support locators. Prefer using locator methods instead.
+:::
+
 Consider the following DOM structure:
 
 ```html
@@ -866,8 +870,10 @@ If _no element_ matches the selector, an error is thrown. Consider using [`.quer
 
 If _multiple elements_ match the selector, an error is thrown. Use [`.elements()`](#elements) when you need all matching DOM Elements or [`.all()`](#all) if you need an array of locators matching the selector.
 
-::: tip
-This method can be useful if you need to pass it down to an external library. It is called automatically when locator is used with `expect.element` every time the assertion is [retried](/api/browser/assertions):
+::: danger
+This is an escape hatch for external APIs that do not support locators. Prefer using locator methods instead.
+
+It is called automatically when locator is used with `expect.element` every time the assertion is [retried](/api/browser/assertions):
 
 ```ts
 await expect.element(page.getByRole('button')).toBeDisabled()