microsoft · compulim · Nov 12, 2025 · Oct 24, 2025 · Oct 25, 2025 · Oct 27, 2025
@@ -147,6 +147,7 @@ Notes: web developers are advised to use [`~` (tilde range)](https://github.com/
 - Cleaned up `<ThemeProvider>` and various CSS related code, in PR [#5611](https://github.com/microsoft/BotFramework-WebChat/pull/5611), by [@compulim](https://github.com/compulim)
 - (Experimental) Reworked the copilot variant to align with the modern Copilot UX, in PR [#5630](https://github.com/microsoft/BotFramework-WebChat/pull/5630), by [@OEvgeny](https://github.com/OEvgeny)
    - The legacy design is temporarily available as `copilot-deprecated` for migration
+- New JSON-LD graph backend, by [@compulim](https://github.com/compulim) in PR [#5622](https://github.com/microsoft/BotFramework-WebChat/pull/5622)
 
 ### Changed
 

@@ -0,0 +1,87 @@
+<!doctype html>
+<html lang="en-US">
+  <head>
+    <link href="/assets/index.css" rel="stylesheet" type="text/css" />
+  </head>
+  <body>
+    <main id="webchat"></main>
+    <script type="importmap">
+      {
+        "imports": {
+          "botframework-webchat": "/__dist__/packages/bundle/static/botframework-webchat.js",
+          "react": "/__dist__/packages/bundle/static/react.js",
+          "react-dom": "/__dist__/packages/bundle/static/react-dom.js"
+        }
+      }
+    </script>
+    <script type="module">
+      import '/test-harness.mjs';
+      import '/test-page-object.mjs';
+
+      import { createDirectLine, createStoreWithOptions, renderWebChat } from 'botframework-webchat';
+      import { version } from 'react';
+
+      run(async function () {
+        const {
+          testHelpers: { createDirectLineEmulator }
+        } = window;
+
+        // TODO: This is for `createDirectLineEmulator` only, should find ways to eliminate this line.
+        window.WebChat = { createStoreWithOptions };
+
+        const { directLine, store } = createDirectLineEmulator();
+
+        renderWebChat({ directLine, store }, document.getElementById('webchat'));
+
+        await pageConditions.uiConnected();
+
+        const now = Date.now();
+
+        await directLine.emulateIncomingActivity({
+          from: { role: 'bot' },
+          text: '1 without timestamp.',
+          timestamp: undefined,
+          type: 'message'
+        });
+
+        await directLine.emulateIncomingActivity({
+          from: { role: 'bot' },
+          text: '2 with t = 0.',
+          timestamp: new Date(now).toISOString(),
+          type: 'message'
+        });
+
+        await directLine.emulateIncomingActivity({
+          from: { role: 'bot' },
+          text: '4 with t = 2.',
+          timestamp: new Date(now + 2).toISOString(),
+          type: 'message'
+        });
+
+        await directLine.emulateIncomingActivity({
+          from: { role: 'bot' },
+          text: '5 without timestamp.',
+          timestamp: undefined,
+          type: 'message'
+        });
+
+        await directLine.emulateIncomingActivity({
+          from: { role: 'bot' },
+          text: '3 with t = 1.',
+          timestamp: new Date(now + 1).toISOString(),
+          type: 'message'
+        });
+
+        expect(pageElements.activityContents().map(({ textContent }) => textContent)).toEqual([
+          '1 without timestamp.',
+          '2 with t = 0.',
+          '3 with t = 1.',
+          '4 with t = 2.',
+          '5 without timestamp.'
+        ]);
+
+        await host.snapshot('local');
+      });
+    </script>
+  </body>
+</html>
@@ -0,0 +1,50 @@
+<!doctype html>
+<html lang="en-US">
+  <head>
+    <link href="/assets/index.css" rel="stylesheet" type="text/css" />
+  </head>
+  <body>
+    <main id="webchat"></main>
+    <script type="importmap">
+      {
+        "imports": {
+          "botframework-webchat": "/__dist__/packages/bundle/static/botframework-webchat.js",
+          "react": "/__dist__/packages/bundle/static/react.js",
+          "react-dom": "/__dist__/packages/bundle/static/react-dom.js"
+        }
+      }
+    </script>
+    <script type="module">
+      import '/test-harness.mjs';
+      import '/test-page-object.mjs';
+
+      import { createDirectLine, createStoreWithOptions, renderWebChat } from 'botframework-webchat';
+      import { version } from 'react';
+
+      run(async function () {
+        const {
+          testHelpers: { createDirectLineEmulator }
+        } = window;
+
+        // TODO: This is for `createDirectLineEmulator` only, should find ways to eliminate this line.
+        window.WebChat = { createStoreWithOptions };
+
+        const { directLine, store } = createDirectLineEmulator();
+
+        renderWebChat({ directLine, store }, document.getElementById('webchat'));
+
+        await pageConditions.uiConnected();
+
+        await directLine.emulateOutgoingActivity('One.');
+
+        await pageConditions.numActivitiesShown(1);
+
+        await directLine.emulateOutgoingActivity('Two.');
+
+        await pageConditions.numActivitiesShown(2);
+
+        expect(pageElements.activityContents().map(({ textContent }) => textContent)).toEqual(['One.', 'Two.']);
+      });
+    </script>
+  </body>
+</html>
@@ -26,6 +26,7 @@
             () =>
               createDirectLineWithTranscript([
                 {
+                  id: 'a-00001', // ID is needed to make sure activity is not added twice when remounted and resubscribed.
                   text: `Hello, World!`,
                   type: 'message',
                   timestamp: '2000-01-23T12:34:56.12345Z'

@@ -78,6 +78,8 @@
         await pageObjects.sendMessageViaSendBox('User activity has timestamp of 1.', { waitForSend: false });
         await pageObjects.sendMessageViaSendBox('User activity has timestamp of 0.', { waitForSend: false });
 
+        await pageConditions.numActivitiesShown(3);
+
         const { activities } = store.getState();
 
         // THEN: The first outgoing message should be the second, after the bot's message.
@@ -86,14 +88,16 @@
         // THEN: The second outgoing message should be the third.
         expect(activities[2].text).toBe('User activity has timestamp of 0.');
 
-        // THEN: The first outgoing message should have a smaller sequence ID than the bot's message.
+        // THEN: The first outgoing message should have a smaller position than the bot's message.
         expect(
-          activities[0].channelData['webchat:sequence-id'] < activities[1].channelData['webchat:sequence-id']
+          activities[0].channelData['webchat:internal:position'] <
+            activities[1].channelData['webchat:internal:position']
         ).toBe(true);
 
-        // THEN: The first outgoing message should have a smaller sequence ID than the second outgoing message.
+        // THEN: The first outgoing message should have a smaller position than the second outgoing message.
         expect(
-          activities[1].channelData['webchat:sequence-id'] < activities[2].channelData['webchat:sequence-id']
+          activities[1].channelData['webchat:internal:position'] <
+            activities[2].channelData['webchat:internal:position']
         ).toBe(true);
 
         // THEN: Both outgoing messages should not send "webchat:sequence-id" and "state".

@@ -278,4 +278,4 @@
   </script>
 </body>
 
-</html>
+</html>
@@ -136,6 +136,7 @@
         );
 
         await pageConditions.uiConnected();
+        await pageConditions.numActivitiesShown(3);
 
         await host.snapshot('local');
 

@@ -0,0 +1,11 @@
+import { v4 } from 'uuid';
+
+// In browser, only works in secure context.
+if (!global.crypto?.randomUUID) {
+  global.crypto = {
+    ...global.crypto,
+    randomUUID() {
+      return v4();
+    }
+  };
+}
@@ -63,14 +63,17 @@ module.exports = {
     '<rootDir>/__tests__/setup/setupGlobalAgent.js',
     '<rootDir>/__tests__/setup/preSetupTestFramework.js',
     '<rootDir>/__tests__/setup/setupCryptoGetRandomValues.js',
+    '<rootDir>/__tests__/setup/setupCryptoRandomUUID.js',
     '<rootDir>/__tests__/setup/setupImageSnapshot.js',
     '<rootDir>/__tests__/setup/setupTestNightly.js',
     '<rootDir>/__tests__/setup/setupTimeout.js'
   ],
   testMatch: ['**/__tests__/**/*.?([mc])[jt]s?(x)', '**/?(*.)+(spec|test).?([mc])[jt]s?(x)'],
   testPathIgnorePatterns: [
+    '/dist/',
     '/lib/',
     '/node_modules/',
+    '/static/',
     '<rootDir>/__tests__/html/.*?(\\.html)',
     '<rootDir>/__tests__/html/__dist__',
     '<rootDir>/__tests__/html/__jest__',

@@ -12,6 +12,7 @@ module.exports = {
   '**/*.md': prettierMarkdown,
   'packages/**/*.css': ['npm run precommit:biome'],
   'packages/api/src/**/*.{mjs,js,ts,tsx}': ['npm run precommit:eslint:api'],
+  'packages/api-graph/src/**/*.{mjs,js,ts,tsx}': ['npm run precommit:eslint:api-graph'],
   'packages/api-middleware/src/**/*.{mjs,js,ts,tsx}': ['npm run precommit:eslint:api-middleware'],
   'packages/base/src/**/*.{mjs,js,ts,tsx}': ['npm run precommit:eslint:base'],
   'packages/bundle/src/**/*.{mjs,js,ts,tsx}': ['npm run precommit:eslint:bundle'],
-Original file line number
+Diff line change
@@ Expand Up / @@ -278,4 +278,4 @@ @@
       </script>
     </body>
-    </html>
+    </html>