285 lines
		
	
	
		
			16 KiB
		
	
	
	
		
			TypeScript
		
	
	
			
		
		
	
	
			285 lines
		
	
	
		
			16 KiB
		
	
	
	
		
			TypeScript
		
	
	
/*
 | 
						|
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';
 | 
						|
// eslint-disable-next-line deprecate/import
 | 
						|
import { mount, ReactWrapper } from 'enzyme';
 | 
						|
import { IPushRule, IPushRules, RuleId, IPusher } from 'matrix-js-sdk/src/matrix';
 | 
						|
import { IThreepid, ThreepidMedium } from 'matrix-js-sdk/src/@types/threepids';
 | 
						|
import { act } from 'react-dom/test-utils';
 | 
						|
 | 
						|
import Notifications from '../../../../src/components/views/settings/Notifications';
 | 
						|
import SettingsStore from "../../../../src/settings/SettingsStore";
 | 
						|
import { StandardActions } from '../../../../src/notifications/StandardActions';
 | 
						|
import { getMockClientWithEventEmitter } from '../../../test-utils';
 | 
						|
 | 
						|
// don't pollute test output with error logs from mock rejections
 | 
						|
jest.mock("matrix-js-sdk/src/logger");
 | 
						|
 | 
						|
// Avoid indirectly importing any eagerly created stores that would require extra setup
 | 
						|
jest.mock("../../../../src/Notifier");
 | 
						|
 | 
						|
const masterRule = {
 | 
						|
    actions: ["dont_notify"],
 | 
						|
    conditions: [],
 | 
						|
    default: true,
 | 
						|
    enabled: false,
 | 
						|
    rule_id: RuleId.Master,
 | 
						|
};
 | 
						|
// eslint-disable-next-line max-len
 | 
						|
const oneToOneRule = { "conditions": [{ "kind": "room_member_count", "is": "2" }, { "kind": "event_match", "key": "type", "pattern": "m.room.message" }], "actions": ["notify", { "set_tweak": "highlight", "value": false }], "rule_id": ".m.rule.room_one_to_one", "default": true, "enabled": true } as IPushRule;
 | 
						|
// eslint-disable-next-line max-len
 | 
						|
const encryptedOneToOneRule = { "conditions": [{ "kind": "room_member_count", "is": "2" }, { "kind": "event_match", "key": "type", "pattern": "m.room.encrypted" }], "actions": ["notify", { "set_tweak": "sound", "value": "default" }, { "set_tweak": "highlight", "value": false }], "rule_id": ".m.rule.encrypted_room_one_to_one", "default": true, "enabled": true } as IPushRule;
 | 
						|
// eslint-disable-next-line max-len
 | 
						|
const encryptedGroupRule = { "conditions": [{ "kind": "event_match", "key": "type", "pattern": "m.room.encrypted" }], "actions": ["dont_notify"], "rule_id": ".m.rule.encrypted", "default": true, "enabled": true } as IPushRule;
 | 
						|
// eslint-disable-next-line max-len
 | 
						|
const pushRules: IPushRules = { "global": { "underride": [{ "conditions": [{ "kind": "event_match", "key": "type", "pattern": "m.call.invite" }], "actions": ["notify", { "set_tweak": "sound", "value": "ring" }, { "set_tweak": "highlight", "value": false }], "rule_id": ".m.rule.call", "default": true, "enabled": true }, oneToOneRule, encryptedOneToOneRule, { "conditions": [{ "kind": "event_match", "key": "type", "pattern": "m.room.message" }], "actions": ["notify", { "set_tweak": "sound", "value": "default" }, { "set_tweak": "highlight", "value": false }], "rule_id": ".m.rule.message", "default": true, "enabled": true }, encryptedGroupRule, { "conditions": [{ "kind": "event_match", "key": "type", "pattern": "im.vector.modular.widgets" }, { "kind": "event_match", "key": "content.type", "pattern": "jitsi" }, { "kind": "event_match", "key": "state_key", "pattern": "*" }], "actions": ["notify", { "set_tweak": "highlight", "value": false }], "rule_id": ".im.vector.jitsi", "default": true, "enabled": true }], "sender": [], "room": [{ "actions": ["dont_notify"], "rule_id": "!zJPyWqpMorfCcWObge:matrix.org", "default": false, "enabled": true }], "content": [{ "actions": ["notify", { "set_tweak": "highlight", "value": false }], "pattern": "banana", "rule_id": "banana", "default": false, "enabled": true }, { "actions": ["notify", { "set_tweak": "sound", "value": "default" }, { "set_tweak": "highlight" }], "pattern": "kadev1", "rule_id": ".m.rule.contains_user_name", "default": true, "enabled": true }], "override": [{ "conditions": [], "actions": ["dont_notify"], "rule_id": ".m.rule.master", "default": true, "enabled": false }, { "conditions": [{ "kind": "event_match", "key": "content.msgtype", "pattern": "m.notice" }], "actions": ["dont_notify"], "rule_id": ".m.rule.suppress_notices", "default": true, "enabled": true }, { "conditions": [{ "kind": "event_match", "key": "type", "pattern": "m.room.member" }, { "kind": "event_match", "key": "content.membership", "pattern": "invite" }, { "kind": "event_match", "key": "state_key", "pattern": "@kadev1:matrix.org" }], "actions": ["notify", { "set_tweak": "sound", "value": "default" }, { "set_tweak": "highlight", "value": false }], "rule_id": ".m.rule.invite_for_me", "default": true, "enabled": true }, { "conditions": [{ "kind": "event_match", "key": "type", "pattern": "m.room.member" }], "actions": ["dont_notify"], "rule_id": ".m.rule.member_event", "default": true, "enabled": true }, { "conditions": [{ "kind": "contains_display_name" }], "actions": ["notify", { "set_tweak": "sound", "value": "default" }, { "set_tweak": "highlight" }], "rule_id": ".m.rule.contains_display_name", "default": true, "enabled": true }, { "conditions": [{ "kind": "event_match", "key": "content.body", "pattern": "@room" }, { "kind": "sender_notification_permission", "key": "room" }], "actions": ["notify", { "set_tweak": "highlight", "value": true }], "rule_id": ".m.rule.roomnotif", "default": true, "enabled": true }, { "conditions": [{ "kind": "event_match", "key": "type", "pattern": "m.room.tombstone" }, { "kind": "event_match", "key": "state_key", "pattern": "" }], "actions": ["notify", { "set_tweak": "highlight", "value": true }], "rule_id": ".m.rule.tombstone", "default": true, "enabled": true }, { "conditions": [{ "kind": "event_match", "key": "type", "pattern": "m.reaction" }], "actions": ["dont_notify"], "rule_id": ".m.rule.reaction", "default": true, "enabled": true }] }, "device": {} } as IPushRules;
 | 
						|
 | 
						|
const flushPromises = async () => await new Promise(resolve => setTimeout(resolve));
 | 
						|
 | 
						|
describe('<Notifications />', () => {
 | 
						|
    const getComponent = () => mount(<Notifications />);
 | 
						|
 | 
						|
    // get component, wait for async data and force a render
 | 
						|
    const getComponentAndWait = async () => {
 | 
						|
        const component = getComponent();
 | 
						|
        await flushPromises();
 | 
						|
        component.setProps({});
 | 
						|
        return component;
 | 
						|
    };
 | 
						|
 | 
						|
    const mockClient = getMockClientWithEventEmitter({
 | 
						|
        getPushRules: jest.fn(),
 | 
						|
        getPushers: jest.fn(),
 | 
						|
        getThreePids: jest.fn(),
 | 
						|
        setPusher: jest.fn(),
 | 
						|
        setPushRuleEnabled: jest.fn(),
 | 
						|
        setPushRuleActions: jest.fn(),
 | 
						|
        getRooms: jest.fn().mockReturnValue([]),
 | 
						|
    });
 | 
						|
    mockClient.getPushRules.mockResolvedValue(pushRules);
 | 
						|
 | 
						|
    const findByTestId = (component, id) => component.find(`[data-test-id="${id}"]`);
 | 
						|
 | 
						|
    beforeEach(() => {
 | 
						|
        mockClient.getPushRules.mockClear().mockResolvedValue(pushRules);
 | 
						|
        mockClient.getPushers.mockClear().mockResolvedValue({ pushers: [] });
 | 
						|
        mockClient.getThreePids.mockClear().mockResolvedValue({ threepids: [] });
 | 
						|
        mockClient.setPusher.mockClear().mockResolvedValue({});
 | 
						|
    });
 | 
						|
 | 
						|
    it('renders spinner while loading', () => {
 | 
						|
        const component = getComponent();
 | 
						|
        expect(component.find('.mx_Spinner').length).toBeTruthy();
 | 
						|
    });
 | 
						|
 | 
						|
    it('renders error message when fetching push rules fails', async () => {
 | 
						|
        mockClient.getPushRules.mockRejectedValue({});
 | 
						|
        const component = await getComponentAndWait();
 | 
						|
        expect(findByTestId(component, 'error-message').length).toBeTruthy();
 | 
						|
    });
 | 
						|
    it('renders error message when fetching pushers fails', async () => {
 | 
						|
        mockClient.getPushers.mockRejectedValue({});
 | 
						|
        const component = await getComponentAndWait();
 | 
						|
        expect(findByTestId(component, 'error-message').length).toBeTruthy();
 | 
						|
    });
 | 
						|
    it('renders error message when fetching threepids fails', async () => {
 | 
						|
        mockClient.getThreePids.mockRejectedValue({});
 | 
						|
        const component = await getComponentAndWait();
 | 
						|
        expect(findByTestId(component, 'error-message').length).toBeTruthy();
 | 
						|
    });
 | 
						|
 | 
						|
    describe('main notification switches', () => {
 | 
						|
        it('renders only enable notifications switch when notifications are disabled', async () => {
 | 
						|
            const disableNotificationsPushRules = {
 | 
						|
                global: {
 | 
						|
                    ...pushRules.global,
 | 
						|
                    override: [{ ...masterRule, enabled: true }],
 | 
						|
                },
 | 
						|
            } as unknown as IPushRules;
 | 
						|
            mockClient.getPushRules.mockClear().mockResolvedValue(disableNotificationsPushRules);
 | 
						|
            const component = await getComponentAndWait();
 | 
						|
 | 
						|
            expect(component).toMatchSnapshot();
 | 
						|
        });
 | 
						|
        it('renders switches correctly', async () => {
 | 
						|
            const component = await getComponentAndWait();
 | 
						|
 | 
						|
            expect(findByTestId(component, 'notif-master-switch').length).toBeTruthy();
 | 
						|
            expect(findByTestId(component, 'notif-setting-notificationsEnabled').length).toBeTruthy();
 | 
						|
            expect(findByTestId(component, 'notif-setting-notificationBodyEnabled').length).toBeTruthy();
 | 
						|
            expect(findByTestId(component, 'notif-setting-audioNotificationsEnabled').length).toBeTruthy();
 | 
						|
        });
 | 
						|
 | 
						|
        describe('email switches', () => {
 | 
						|
            const testEmail = 'tester@test.com';
 | 
						|
            beforeEach(() => {
 | 
						|
                mockClient.getThreePids.mockResolvedValue({
 | 
						|
                    threepids: [
 | 
						|
                        // should render switch bc pushKey and address match
 | 
						|
                        {
 | 
						|
                            medium: ThreepidMedium.Email,
 | 
						|
                            address: testEmail,
 | 
						|
                        } as unknown as IThreepid,
 | 
						|
                    ],
 | 
						|
                });
 | 
						|
            });
 | 
						|
 | 
						|
            it('renders email switches correctly when email 3pids exist', async () => {
 | 
						|
                const component = await getComponentAndWait();
 | 
						|
 | 
						|
                expect(findByTestId(component, 'notif-email-switch')).toMatchSnapshot();
 | 
						|
            });
 | 
						|
 | 
						|
            it('renders email switches correctly when notifications are on for email', async () => {
 | 
						|
                mockClient.getPushers.mockResolvedValue({
 | 
						|
                    pushers: [
 | 
						|
                        { kind: 'email', pushkey: testEmail } as unknown as IPusher,
 | 
						|
                    ],
 | 
						|
                });
 | 
						|
                const component = await getComponentAndWait();
 | 
						|
 | 
						|
                expect(findByTestId(component, 'notif-email-switch').props().value).toEqual(true);
 | 
						|
            });
 | 
						|
 | 
						|
            it('enables email notification when toggling on', async () => {
 | 
						|
                const component = await getComponentAndWait();
 | 
						|
 | 
						|
                const emailToggle = findByTestId(component, 'notif-email-switch')
 | 
						|
                    .find('div[role="switch"]');
 | 
						|
 | 
						|
                await act(async () => {
 | 
						|
                    emailToggle.simulate('click');
 | 
						|
                });
 | 
						|
 | 
						|
                expect(mockClient.setPusher).toHaveBeenCalledWith(expect.objectContaining({
 | 
						|
                    kind: "email",
 | 
						|
                    app_id: "m.email",
 | 
						|
                    pushkey: testEmail,
 | 
						|
                    app_display_name: "Email Notifications",
 | 
						|
                    device_display_name: testEmail,
 | 
						|
                    append: true,
 | 
						|
                }));
 | 
						|
            });
 | 
						|
 | 
						|
            it('displays error when pusher update fails', async () => {
 | 
						|
                mockClient.setPusher.mockRejectedValue({});
 | 
						|
                const component = await getComponentAndWait();
 | 
						|
 | 
						|
                const emailToggle = findByTestId(component, 'notif-email-switch')
 | 
						|
                    .find('div[role="switch"]');
 | 
						|
 | 
						|
                await act(async () => {
 | 
						|
                    emailToggle.simulate('click');
 | 
						|
                });
 | 
						|
 | 
						|
                // force render
 | 
						|
                await flushPromises();
 | 
						|
                await component.setProps({});
 | 
						|
 | 
						|
                expect(findByTestId(component, 'error-message').length).toBeTruthy();
 | 
						|
            });
 | 
						|
 | 
						|
            it('enables email notification when toggling off', async () => {
 | 
						|
                const testPusher = { kind: 'email', pushkey: 'tester@test.com' } as unknown as IPusher;
 | 
						|
                mockClient.getPushers.mockResolvedValue({ pushers: [testPusher] });
 | 
						|
                const component = await getComponentAndWait();
 | 
						|
 | 
						|
                const emailToggle = findByTestId(component, 'notif-email-switch')
 | 
						|
                    .find('div[role="switch"]');
 | 
						|
 | 
						|
                await act(async () => {
 | 
						|
                    emailToggle.simulate('click');
 | 
						|
                });
 | 
						|
 | 
						|
                expect(mockClient.setPusher).toHaveBeenCalledWith({
 | 
						|
                    ...testPusher, kind: null,
 | 
						|
                });
 | 
						|
            });
 | 
						|
        });
 | 
						|
 | 
						|
        it('toggles and sets settings correctly', async () => {
 | 
						|
            const component = await getComponentAndWait();
 | 
						|
            let audioNotifsToggle: ReactWrapper;
 | 
						|
 | 
						|
            const update = () => {
 | 
						|
                audioNotifsToggle = findByTestId(component, 'notif-setting-audioNotificationsEnabled')
 | 
						|
                    .find('div[role="switch"]');
 | 
						|
            };
 | 
						|
            update();
 | 
						|
 | 
						|
            expect(audioNotifsToggle.getDOMNode<HTMLElement>().getAttribute("aria-checked")).toEqual("true");
 | 
						|
            expect(SettingsStore.getValue("audioNotificationsEnabled")).toEqual(true);
 | 
						|
 | 
						|
            act(() => { audioNotifsToggle.simulate('click'); });
 | 
						|
            update();
 | 
						|
 | 
						|
            expect(audioNotifsToggle.getDOMNode<HTMLElement>().getAttribute("aria-checked")).toEqual("false");
 | 
						|
            expect(SettingsStore.getValue("audioNotificationsEnabled")).toEqual(false);
 | 
						|
        });
 | 
						|
    });
 | 
						|
 | 
						|
    describe('individual notification level settings', () => {
 | 
						|
        const getCheckedRadioForRule = (ruleEl) =>
 | 
						|
            ruleEl.find('input[type="radio"][checked=true]').props()['aria-label'];
 | 
						|
        it('renders categories correctly', async () => {
 | 
						|
            const component = await getComponentAndWait();
 | 
						|
 | 
						|
            expect(findByTestId(component, 'notif-section-vector_global').length).toBeTruthy();
 | 
						|
            expect(findByTestId(component, 'notif-section-vector_mentions').length).toBeTruthy();
 | 
						|
            expect(findByTestId(component, 'notif-section-vector_other').length).toBeTruthy();
 | 
						|
        });
 | 
						|
 | 
						|
        it('renders radios correctly', async () => {
 | 
						|
            const component = await getComponentAndWait();
 | 
						|
            const section = 'vector_global';
 | 
						|
 | 
						|
            const globalSection = findByTestId(component, `notif-section-${section}`);
 | 
						|
            // 4 notification rules with class 'global'
 | 
						|
            expect(globalSection.find('fieldset').length).toEqual(4);
 | 
						|
            // oneToOneRule is set to 'on'
 | 
						|
            const oneToOneRuleElement = findByTestId(component, section + oneToOneRule.rule_id);
 | 
						|
            expect(getCheckedRadioForRule(oneToOneRuleElement)).toEqual('On');
 | 
						|
            // encryptedOneToOneRule is set to 'loud'
 | 
						|
            const encryptedOneToOneElement = findByTestId(component, section + encryptedOneToOneRule.rule_id);
 | 
						|
            expect(getCheckedRadioForRule(encryptedOneToOneElement)).toEqual('Noisy');
 | 
						|
            // encryptedGroupRule is set to 'off'
 | 
						|
            const encryptedGroupElement = findByTestId(component, section + encryptedGroupRule.rule_id);
 | 
						|
            expect(getCheckedRadioForRule(encryptedGroupElement)).toEqual('Off');
 | 
						|
        });
 | 
						|
 | 
						|
        it('updates notification level when changed', async () => {
 | 
						|
            const component = await getComponentAndWait();
 | 
						|
            const section = 'vector_global';
 | 
						|
 | 
						|
            // oneToOneRule is set to 'on'
 | 
						|
            // and is kind: 'underride'
 | 
						|
            const oneToOneRuleElement = findByTestId(component, section + oneToOneRule.rule_id);
 | 
						|
 | 
						|
            await act(async () => {
 | 
						|
                // toggle at 0 is 'off'
 | 
						|
                const offToggle = oneToOneRuleElement.find('input[type="radio"]').at(0);
 | 
						|
                offToggle.simulate('change');
 | 
						|
            });
 | 
						|
 | 
						|
            expect(mockClient.setPushRuleEnabled).toHaveBeenCalledWith(
 | 
						|
                'global', 'underride', oneToOneRule.rule_id, true);
 | 
						|
 | 
						|
            // actions for '.m.rule.room_one_to_one' state is ACTION_DONT_NOTIFY
 | 
						|
            expect(mockClient.setPushRuleActions).toHaveBeenCalledWith(
 | 
						|
                'global', 'underride', oneToOneRule.rule_id, StandardActions.ACTION_DONT_NOTIFY);
 | 
						|
        });
 | 
						|
    });
 | 
						|
});
 |