[web-pubsub] Migrate web-pubsub projects to use snippets extraction (#…

…33188)

### Packages impacted by this PR

- @azure/web-pubsub
- @azure/web-pubsub-client
- @azure/web-pubsub-client-protobuf
- @azure/web-pubsub-express

### Issues associated with this PR

- #32416

### Describe the problem that is addressed by this PR

Updates all projects under `web-pubsub` to use snippets extraction.

### What are the possible designs available to address the problem? If
there are more than one possible design, why was the one in this PR
chosen?


### Are there test cases added in this PR? _(If not, why?)_


### Provide a list of related PRs _(if any)_


### Command used to generate this PR:**_(Applicable only to SDK release
request PRs)_

### Checklists
- [ ] Added impacted package name to the issue description
- [ ] Does this PR needs any fixes in the SDK Generator?** _(If so,
create an Issue in the
[Autorest/typescript](https://github.com/Azure/autorest.typescript)
repository and link it here)_
- [ ] Added a changelog (if necessary)

sdk/web-pubsub/web-pubsub-client-protobuf/README.md

@@ -1,10 +1,9 @@
 # Web PubSub client protobuf protocol library for JavaScript
 
-[Azure Web PubSub](https://aka.ms/awps/doc) is a cloud service that helps developers easily build real-time features in web applications with publish-subscribe patterns at scale. 
+[Azure Web PubSub](https://aka.ms/awps/doc) is a cloud service that helps developers easily build real-time features in web applications with publish-subscribe patterns at scale.
 
 You can use this library to add protobuf subprotocols including `protobuf.reliable.webpubsub.azure.v1` and `protobuf.webpubsub.azure.v1` support to `@azure/web-pubsub-client` library.
 
-
 ## Getting started
 
 ### Currently supported environments
@@ -24,39 +23,55 @@ npm install @azure/web-pubsub-client-protobuf
 
 ### 2. Use Protobuf protocols
 
-```javascript
-const client = new WebPubSubClient("client-access-url", { protocol: WebPubSubProtobufReliableProtocol() });
+```ts snippet:ReadmeSampleCreateClient
+import { WebPubSubClient } from "@azure/web-pubsub-client";
+import { WebPubSubProtobufReliableProtocol } from "@azure/web-pubsub-client-protobuf";
+
+const client = new WebPubSubClient("client-access-url", {
+  protocol: WebPubSubProtobufReliableProtocol(),
+});
 ```
 
 ## Troubleshooting
 
-- ### Enable logs
+### Enable logs
 
-  You can set the following environment variable to get the debug logs when using this library.
+Enabling logging may help uncover useful information about failures. In order to see a log of HTTP requests and responses, set the `AZURE_LOG_LEVEL` environment variable to `info`.
 
 ```bash
 export AZURE_LOG_LEVEL=verbose
 ```
 
+Alternatively, logging can be enabled at runtime by calling `setLogLevel` in the `@azure/logger`:
+
+```ts snippet:SetLogLevel
+import { setLogLevel } from "@azure/logger";
+
+setLogLevel("info");
+```
+
 For more detailed instructions on how to enable logs, you can look at the [@azure/logger package docs](https://github.com/Azure/azure-sdk-for-js/tree/main/sdk/core/logger).
 
 - ### Live Trace
 
   Use [Live Trace tool][live_trace] from Web PubSub portal to view the live traffic.
+
 ---
+
 ## Additional resources
+
 - Learn more about client permission, see [permissions](https://learn.microsoft.com/azure/azure-web-pubsub/reference-json-reliable-webpubsub-subprotocol#permissions)
 
-- [Server SDK - JavaScript documentation](https://aka.ms/awps/sdk/js) 
+- [Server SDK - JavaScript documentation](https://aka.ms/awps/sdk/js)
 - [Product documentation](https://aka.ms/awps/doc)
 - [Samples][samples_ref]
 
 ---
+
 ## Contributing
 
 If you'd like to contribute to this library, please read the [contributing guide](https://github.com/Azure/azure-sdk-for-js/blob/main/CONTRIBUTING.md) to learn more about how to build and test the code.
 
-
 [azure_sub]: https://azure.microsoft.com/free/
 [samples_ref]: https://github.com/Azure/azure-webpubsub/tree/main/samples/javascript/
 [create_instance]: https://learn.microsoft.com/azure/azure-web-pubsub/howto-develop-create-instance

sdk/web-pubsub/web-pubsub-client-protobuf/api-extractor.json

@@ -11,7 +11,7 @@
   "dtsRollup": {
     "enabled": true,
     "untrimmedFilePath": "",
-    "publicTrimmedFilePath": "./dist/web-pubsub-client-protobuf.d.ts"
+    "publicTrimmedFilePath": "dist/web-pubsub-client-protobuf.d.ts"
   },
   "messages": {
     "tsdocMessageReporting": {

sdk/web-pubsub/web-pubsub-client-protobuf/package.json

@@ -6,10 +6,7 @@
   "type": "module",
   "main": "./dist/commonjs/index.js",
   "module": "./dist/esm/index.js",
-  "browser": {
-    "buffer": "buffer",
-    "default": "dist/browser/index.js"
-  },
+  "browser": "./dist/browser/index.js",
   "types": "./dist/commonjs/index.d.ts",
   "scripts": {
     "build": "npm run clean && npm run build-protobuf && dev-tool run build-package && npm run copy-files && dev-tool run extract-api",
@@ -39,13 +36,11 @@
     "test:node": "npm run build:test && npm run unit-test:node && npm run integration-test:node",
     "unit-test": "npm run unit-test:node && npm run unit-test:browser",
     "unit-test:browser": "echo skipped",
-    "unit-test:node": "dev-tool run test:vitest --no-test-proxy",
-    "update-snippets": "echo skipped"
+    "unit-test:node": "dev-tool run test:vitest",
+    "update-snippets": "dev-tool run update-snippets"
   },
   "files": [
     "dist/",
-    "types/web-pubsub-client-protobuf.d.ts",
-    "types/web-pubsub-client-protobuf.d.ts.map",
     "README.md",
     "LICENSE"
   ],
@@ -65,25 +60,28 @@
   "homepage": "https://github.com/Azure/azure-sdk-for-js/tree/main/sdk/web-pubsub/web-pubsub-client/README.md",
   "sideEffects": false,
   "dependencies": {
-    "@azure/logger": "^1.0.0",
+    "@azure/logger": "^1.1.4",
     "@azure/web-pubsub-client": "1.0.0-beta.2",
     "long": "^5.3.1",
     "protobufjs": "^7.4.0",
-    "tslib": "^2.6.2"
+    "tslib": "^2.8.1"
   },
   "devDependencies": {
+    "@azure-tools/test-utils-vitest": "^1.0.0",
     "@azure/dev-tool": "^1.0.0",
     "@azure/eslint-plugin-azure-sdk": "^3.0.0",
     "@azure/web-pubsub": "^1.1.0",
     "@types/node": "^18.0.0",
-    "@vitest/coverage-istanbul": "^3.0.3",
+    "@vitest/browser": "^3.0.6",
+    "@vitest/coverage-istanbul": "^3.0.6",
     "cpy-cli": "^5.0.0",
     "dotenv": "^16.0.0",
     "eslint": "^9.9.0",
     "move-file-cli": "^3.0.0",
+    "playwright": "^1.50.1",
     "protobufjs-cli": "^1.1.3",
     "typescript": "~5.7.2",
-    "vitest": "^3.0.3"
+    "vitest": "^3.0.6"
   },
   "//sampleConfiguration": {
     "productName": "Azure Web PubSub Client",
@@ -92,6 +90,7 @@
     ]
   },
   "tshy": {
+    "project": "./tsconfig.src.json",
     "exports": {
       "./package.json": "./package.json",
       ".": "./src/index.ts"
@@ -100,12 +99,23 @@
       "esm",
       "commonjs"
     ],
-    "selfLink": false,
-    "project": "./tsconfig.src.json"
+    "esmDialects": [
+      "browser",
+      "react-native"
+    ],
+    "selfLink": false
   },
   "exports": {
     "./package.json": "./package.json",
     ".": {
+      "browser": {
+        "types": "./dist/browser/index.d.ts",
+        "default": "./dist/browser/index.js"
+      },
+      "react-native": {
+        "types": "./dist/react-native/index.d.ts",
+        "default": "./dist/react-native/index.js"
+      },
       "import": {
         "types": "./dist/esm/index.d.ts",
         "default": "./dist/esm/index.js"
@@ -115,5 +125,6 @@
         "default": "./dist/commonjs/index.js"
       }
     }
-  }
+  },
+  "react-native": "./dist/react-native/index.js"
 }

sdk/web-pubsub/web-pubsub-client-protobuf/samples-dev/basicusage.ts

@@ -5,13 +5,13 @@
  * @summary Basic usage of web-pubsub-client
  */
 
-import {
-  WebPubSubClient,
+import type {
   WebPubSubClientCredential,
   SendToGroupOptions,
   GetClientAccessUrlOptions,
   WebPubSubClientOptions,
 } from "@azure/web-pubsub-client";
+import { WebPubSubClient } from "@azure/web-pubsub-client";
 import { WebPubSubProtobufReliableProtocol } from "@azure/web-pubsub-client-protobuf";
 import { WebPubSubServiceClient } from "@azure/web-pubsub";
 import "dotenv/config";

sdk/web-pubsub/web-pubsub-client-protobuf/samples/v1-beta/typescript/src/basicusage.ts

@@ -29,7 +29,7 @@ const fetchClientAccessUrl = async (_: GetClientAccessUrlOptions) => {
   ).url;
 };
 
-async function main() {
+async function main(): Promise<void> {
   let client = new WebPubSubClient(
     {
       getClientAccessUrl: fetchClientAccessUrl,

sdk/web-pubsub/web-pubsub-client-protobuf/test/snippets.spec.ts

@@ -0,0 +1,19 @@
+// Copyright (c) Microsoft Corporation.
+// Licensed under the MIT License.
+
+import { setLogLevel } from "@azure/logger";
+import { WebPubSubClient } from "@azure/web-pubsub-client";
+import { describe, it } from "vitest";
+import { WebPubSubProtobufReliableProtocol } from "../src/index.js";
+
+describe("snippets", () => {
+  it("ReadmeSampleCreateClient", async () => {
+    const client = new WebPubSubClient("client-access-url", {
+      protocol: WebPubSubProtobufReliableProtocol(),
+    });
+  });
+
+  it("SetLogLevel", async () => {
+    setLogLevel("info");
+  });
+});

sdk/web-pubsub/web-pubsub-client-protobuf/tsconfig.json

@@ -1,7 +1,13 @@
 {
   "references": [
-    { "path": "./tsconfig.src.json" },
-    { "path": "./tsconfig.samples.json" },
-    { "path": "./tsconfig.test.json" }
+    {
+      "path": "./tsconfig.src.json"
+    },
+    {
+      "path": "./tsconfig.samples.json"
+    },
+    {
+      "path": "./tsconfig.test.json"
+    }
   ]
 }

sdk/web-pubsub/web-pubsub-client-protobuf/vitest.browser.config.ts

@@ -0,0 +1,16 @@
+// Copyright (c) Microsoft Corporation.
+// Licensed under the MIT License.
+
+import { defineConfig, mergeConfig } from "vitest/config";
+import viteConfig from "../../../vitest.browser.shared.config.ts";
+
+export default mergeConfig(
+  viteConfig,
+  defineConfig({
+    test: {
+      include: ["dist-test/browser/test/**/*.spec.js"],
+      testTimeout: 1200000,
+      hookTimeout: 1200000,
+    },
+  }),
+);

sdk/web-pubsub/web-pubsub-client-protobuf/vitest.esm.config.ts

@@ -5,7 +5,4 @@ import { mergeConfig } from "vitest/config";
 import vitestConfig from "./vitest.config.ts";
 import vitestEsmConfig from "../../../vitest.esm.shared.config.ts";
 
-export default mergeConfig(
-  vitestConfig,
-  vitestEsmConfig
-);
+export default mergeConfig(vitestConfig, vitestEsmConfig);