Fix compatibility issues in nodejs copilotstudio-webchat-react sample

[Cecilia Avila (ceciliaavila)]

Description

This PR downgrades the @azure/msal-browser package in the copilotstudio-webchat-react sample to previously used version to avoid compatibility issues.
It also fix a React rendering issue raised after upgrading to version 19.
Additionally, it upgrades some missing @microsoft/agents packages to latest release and fixes the OTel sample not exporting traces problem.

Dependency updates:

• Downgraded @azure/msal-browser from version ^5.18.0/5.19.0 to 4.13.1 and locked the version in both package.json and package-lock.json for samples/nodejs/copilotstudio-webchat-react, including updating its dependency @azure/msal-common to 15.7.0. Also locked @microsoft/agents-copilotstudio-client to 1.7.2. [1] [2] [3]
• Updated @microsoft/agents-hosting and @microsoft/agents-hosting-express to ^1.7.2 in samples/nodejs/cards/package.json and samples/nodejs/entra-agent-id-sidecar/package.json. [1] [2]

React rendering update:

• Refactored the entry point in samples/nodejs/copilotstudio-webchat-react/src/index.tsx to use the modern createRoot API from react-dom/client instead of the legacy ReactDOM.render, improving compatibility with React 18+.

OpenTelemetry instrumentation improvements:

• Added AlwaysOnSampler to the OpenTelemetry SDK configuration in samples/nodejs/otel/src/instrumentation.ts, ensuring all traces are sampled for telemetry. [1] [2]

Testing

This image shows the copilotstudio-webchat-react sample working after the changes.

[Copilot]

Pull request overview

This PR updates several Node.js samples to address dependency compatibility issues (notably MSAL in the Copilot Studio WebChat React sample), modernize React rendering for newer React versions, and improve OpenTelemetry trace sampling behavior.

Changes:

• Pinned/downgraded @azure/msal-browser (and corresponding @azure/msal-common) plus pinned @microsoft/agents-copilotstudio-client in copilotstudio-webchat-react.
• Updated the React sample entrypoint to use react-dom/client’s createRoot API instead of legacy ReactDOM.render.
• Updated Agents SDK package versions in the cards and entra-agent-id-sidecar samples; adjusted lockfiles accordingly; updated OTel instrumentation to sample all traces.

Reviewed changes

Copilot reviewed 4 out of 7 changed files in this pull request and generated 1 comment.

Show a summary per file

File	Description
samples/nodejs/copilotstudio-webchat-react/package.json	Pins MSAL and Copilot Studio client dependency versions for compatibility.
samples/nodejs/copilotstudio-webchat-react/package-lock.json	Aligns lockfile with pinned MSAL/Copilot Studio client versions.
samples/nodejs/copilotstudio-webchat-react/src/index.tsx	Switches to createRoot rendering path for React 18+/19 compatibility.
samples/nodejs/cards/package.json	Updates Agents hosting dependency versions.
samples/nodejs/cards/package-lock.json	Updates lockfile to match Agents hosting dependency changes.
samples/nodejs/entra-agent-id-sidecar/package.json	Updates Agents hosting-express dependency version.
samples/nodejs/entra-agent-id-sidecar/package-lock.json	Updates lockfile for new Agents hosting-express version and transitive deps.
samples/nodejs/otel/src/instrumentation.ts	Ensures trace sampling is always-on to avoid missing traces.

Files not reviewed (3)

• samples/nodejs/cards/package-lock.json: Generated file
• samples/nodejs/copilotstudio-webchat-react/package-lock.json: Generated file
• samples/nodejs/entra-agent-id-sidecar/package-lock.json: Generated file

---

💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.