BotFramework-WebChat/__tests__/html2/citation/showModal.linkDefinitions.html at 5afef9f65aba265e8e8dfa69523d88282dc2f1d8 · microsoft/BotFramework-WebChat · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
<!doctype html>
<html lang="en-US">
  <head>
    <link href="/assets/index.css" rel="stylesheet" type="text/css" />
    <script type="importmap">
      {
        "imports": {
          "@fluentui/react-provider": "/__dist__/packages/test/test-assets/out/@fluentui/react-provider.js",
          "@fluentui/tokens": "/__dist__/packages/test/test-assets/out/@fluentui/tokens.js",
          "react": "https://esm.sh/react@18",
          "react-dom": "https://esm.sh/react-dom@18",
          "react-dom/": "https://esm.sh/react-dom@18/",
          "react-jsx-runtime": "https://esm.sh/react@18/jsx-runtime"
        }
      }
    </script>
    <script crossorigin="anonymous" src="/test-harness.js"></script>
    <script crossorigin="anonymous" src="/test-page-object.js"></script>
    <script type="module">
      import React from 'react';
      window.React = React;
    </script>
    <script defer crossorigin="anonymous" src="/__dist__/webchat-es5.js"></script>
    <script defer crossorigin="anonymous" src="/__dist__/botframework-webchat-fluent-theme.production.min.js"></script>
    <style type="text/css">
      .fui-FluentProvider {
        height: 100%;
      }
    </style>
  </head>
  <body>
    <main id="webchat"></main>
    <script type="module">
      import { FluentProvider } from '@fluentui/react-provider';
      import { webLightTheme } from '@fluentui/tokens';
      import React from 'react';
      import { createRoot } from 'react-dom/client';

      run(async function () {
        const {
          WebChat: { FluentThemeProvider, ReactWebChat }
        } = window;

        const { directLine, store } = testHelpers.createDirectLineEmulator();

        const searchParams = new URLSearchParams(location.search);
        const variant = searchParams.get('variant');

        if (variant) {
          window.checkAccessibility = async () => {};
        }

        const root = createRoot(document.getElementById('webchat'));
        const webChatProps = { directLine, store };

        root.render(
          variant
            ? React.createElement(
                FluentProvider,
                { className: 'fui-FluentProvider', theme: webLightTheme },
                React.createElement(FluentThemeProvider, { variant }, React.createElement(ReactWebChat, webChatProps))
              )
            : React.createElement(ReactWebChat, webChatProps)
        );

        await pageConditions.uiConnected();

        await directLine.emulateIncomingActivity({
          entities: [
            {
              '@context': 'https://schema.org',
              '@id': 'cite:1',
              '@type': 'Claim',
              name: "Should Be Visible",
              type: 'https://schema.org/Claim',
              text: 'Reprehenderit exercitation laborum labore ut. Nostrud do et ut nostrud nisi excepteur labore adipisicing nostrud nostrud ipsum id dolore. Anim aliquip incididunt incididunt sunt sit proident consectetur exercitation qui aliqua aliquip adipisicing nisi et. Id commodo labore sunt quis do aute cillum laborum veniam [proident](https://bing.com/).'
            }
          ],
          text: `Sure, you should override the default proxy settings[1]\u200C[2], when your proxy server requires authentication[3].

[1]: https://support.microsoft.com/en-us/windows/use-a-proxy-server-in-windows-03096c53-0554-4ffe-b6ab-8b1deee8dae1
[2]: https://learn.microsoft.com/en-us/troubleshoot/windows-server/networking/configure-proxy-server-settings "Configure proxy server settings - Windows Server"
[3]: cite:1 "should be hidden"
`,
          type: 'message'
        });

        // When (copilot): opening the link definitions
        if (variant === 'copilot') {
          // Then (copilot): the link definitions should be closed
          await host.snapshot('local');

          await host.click(pageElements.linkDefinitions()[0].querySelector('summary'));
        }

        const linkDefinitionItems = pageElements.linkDefinitions()[0].querySelectorAll('[role="listitem"] > *');

        await host.click(linkDefinitionItems[2]);
        await host.snapshot('local');

        await host.sendTab();
        await host.snapshot('local');
      });
    </script>
  </body>
</html>