Merge branch 'develop' into feat/add-plain-text-mode

test/components/views/elements/LearnMore-test.tsx

@@ -0,0 +1,57 @@
+/*
+Copyright 2022 The Matrix.org Foundation C.I.C.
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+*/
+
+import React from 'react';
+import { fireEvent, render } from '@testing-library/react';
+
+import LearnMore from '../../../../src/components/views/elements/LearnMore';
+import Modal from '../../../../src/Modal';
+import InfoDialog from '../../../../src/components/views/dialogs/InfoDialog';
+
+describe('<LearnMore />', () => {
+    const defaultProps = {
+        title: 'Test',
+        description: 'test test test',
+        ['data-testid']: 'testid',
+    };
+    const getComponent = (props = {}) =>
+        (<LearnMore {...defaultProps} {...props} />);
+
+    const modalSpy = jest.spyOn(Modal, 'createDialog').mockReturnValue(undefined);
+
+    beforeEach(() => {
+        jest.clearAllMocks();
+    });
+
+    it('renders button', () => {
+        const { container } = render(getComponent());
+        expect(container).toMatchSnapshot();
+    });
+
+    it('opens modal on click', async () => {
+        const { getByTestId } = render(getComponent());
+        fireEvent.click(getByTestId('testid'));
+
+        expect(modalSpy).toHaveBeenCalledWith(
+            InfoDialog,
+            {
+                button: 'Got it',
+                description: defaultProps.description,
+                hasCloseButton: true,
+                title: defaultProps.title,
+            });
+    });
+});

test/components/views/elements/__snapshots__/LearnMore-test.tsx.snap

@@ -0,0 +1,14 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<LearnMore /> renders button 1`] = `
+<div>
+  <div
+    class="mx_AccessibleButton mx_LearnMore_button mx_AccessibleButton_hasKind mx_AccessibleButton_kind_link_inline"
+    data-testid="testid"
+    role="button"
+    tabindex="0"
+  >
+    Learn more
+  </div>
+</div>
+`;

test/components/views/settings/devices/__snapshots__/FilteredDeviceList-test.tsx.snap

@@ -37,7 +37,16 @@ HTMLCollection [
         <p
           class="mx_DeviceSecurityCard_description"
         >
-          Consider signing out from old sessions (90 days or older) you don't use anymore
+          <span>
+            Consider signing out from old sessions (90 days or older) you don't use anymore.
+            <div
+              class="mx_AccessibleButton mx_LearnMore_button mx_AccessibleButton_hasKind mx_AccessibleButton_kind_link_inline"
+              role="button"
+              tabindex="0"
+            >
+              Learn more
+            </div>
+          </span>
         </p>
       </div>
     </div>
@@ -72,7 +81,16 @@ HTMLCollection [
         <p
           class="mx_DeviceSecurityCard_description"
         >
-          Verify your sessions for enhanced secure messaging or sign out from those you don't recognize or use anymore.
+          <span>
+            Verify your sessions for enhanced secure messaging or sign out from those you don't recognize or use anymore.
+            <div
+              class="mx_AccessibleButton mx_LearnMore_button mx_AccessibleButton_hasKind mx_AccessibleButton_kind_link_inline"
+              role="button"
+              tabindex="0"
+            >
+              Learn more
+            </div>
+          </span>
         </p>
       </div>
     </div>
@@ -107,7 +125,16 @@ HTMLCollection [
         <p
           class="mx_DeviceSecurityCard_description"
         >
-          For best security, sign out from any session that you don't recognize or use anymore.
+          <span>
+            For best security, sign out from any session that you don't recognize or use anymore.
+            <div
+              class="mx_AccessibleButton mx_LearnMore_button mx_AccessibleButton_hasKind mx_AccessibleButton_kind_link_inline"
+              role="button"
+              tabindex="0"
+            >
+              Learn more
+            </div>
+          </span>
         </p>
       </div>
     </div>