BotFramework-WebChat/__tests__/html2/feedbackForm/behavior.changeMind.keyboard.html at bed66d7e04f1dc7bf4d451fffb13e2c177b9a428 · compulim/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
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
<!doctype html>
<html lang="en-US">
  <head>
    <link href="/assets/index.css" rel="stylesheet" type="text/css" />
    <script crossorigin="anonymous" src="https://unpkg.com/@babel/standalone@7.8.7/babel.min.js"></script>
    <script crossorigin="anonymous" src="/test-harness.js"></script>
    <script crossorigin="anonymous" src="/test-page-object.js"></script>
    <script crossorigin="anonymous" src="/__dist__/webchat-es5.js"></script>
  </head>
  <body>
    <main id="webchat"></main>
    <script type="importmap">
      {
        "imports": {
          "@testduet/wait-for": "https://esm.sh/@testduet/wait-for"
        }
      }
    </script>
    <script type="module">
      import { waitFor } from '@testduet/wait-for';

      run(async function () {
        const {
          WebChat: { renderWebChat, testIds }
        } = window; // Imports in UMD fashion.

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

        const styleOptions = {
          feedbackActionsPlacement: 'activity-actions'
        };

        renderWebChat({ directLine, store, styleOptions }, document.getElementById('webchat'));

        await pageConditions.uiConnected();

        await directLine.emulateIncomingActivity({
          channelData: {
            feedbackLoop: {
              type: 'default'
            }
          },
          entities: [
            {
              '@context': 'https://schema.org',
              '@id': '',
              '@type': 'Message',
              type: 'https://schema.org/Message',
              potentialAction: [
                {
                  '@type': 'LikeAction',
                  actionStatus: 'PotentialActionStatus',
                  target: {
                    '@type': 'EntryPoint',
                    urlTemplate: 'ms-directline://postback?interaction=like'
                  }
                },
                {
                  '@type': 'DislikeAction',
                  actionStatus: 'PotentialActionStatus',
                  result: {
                    '@type': 'Review',
                    reviewBody: "I don't like it.",
                    'reviewBody-input': {
                      '@type': 'PropertyValueSpecification',
                      valueMinLength: 3,
                      valueName: 'reason'
                    }
                  },
                  target: {
                    '@type': 'EntryPoint',
                    urlTemplate: 'ms-directline://postback?interaction=dislike{&reason}'
                  }
                }
              ]
            }
          ],
          text: `Ad quis ex deserunt irure in proident velit ut amet irure elit nulla deserunt.`,
          type: 'message'
        });

        await pageConditions.numActivitiesShown(1);

        // WHEN: The dislike button is pressed.
        pageElements.allByTestId(testIds.feedbackButton)[1].focus();
        await host.sendKeys('SPACE');

        // THEN: Should focus on the feedback form text box.
        await waitFor(() => expect(document.activeElement).toBe(pageElements.allByTestId(testIds.feedbackSendBox)[0]));

        // WHEN: SHIFT-TAB is pressed.
        await host.sendShiftTab();

        // THEN: The dislike button should be focused.
        expect(document.activeElement).toBe(pageElements.allByTestId(testIds.feedbackButton)[1]);

        // WHEN: Left arrow key is pressed.
        await host.sendKeys('LEFT');

        // THEN: The like button should be focused.
        expect(document.activeElement).toBe(pageElements.allByTestId(testIds.feedbackButton)[0]);

        // THEN: The like button should be selected.
        expect(pageElements.allByTestId(testIds.feedbackButton)[0].matches(':checked')).toBe(true);

        // WHEN: Type a message in the feedback box and submit.
        await host.sendKeys('TAB');
        await host.sendKeys('Qui sint consequat reprehenderit aliquip esse duis.');

        // THEN: It should submit with like.
        const { activity } = await directLine.actPostActivity(() => host.sendKeys('ENTER'));

        expect(activity).toEqual(
          expect.objectContaining({
            type: 'invoke',
            value: {
              actionName: 'feedback',
              actionValue: {
                feedback: {
                  feedbackText: 'Qui sint consequat reprehenderit aliquip esse duis.'
                },
                reaction: 'like'
              }
            }
          })
        );
      });
    </script>
  </body>
</html>