mirrors/element-web
1
0
Fork 0
mirror of https://github.com/element-hq/element-web synced 2024-11-23 09:46:09 +03:00
Code Issues Projects Releases Packages Wiki Activity

Live location sharing - refresh beacon timers on tab becoming active (#8515)

Browse source 
* add visibilitychange listener

Signed-off-by: Kerry Archibald <kerrya@element.io>

* test

Signed-off-by: Kerry Archibald <kerrya@element.io>

* restore event listener mock

Signed-off-by: Kerry Archibald <kerrya@element.io>
This commit is contained in:
Kerry 2022-05-06 11:33:09 +02:00 committed by GitHub
parent 2c19d286ed
commit e97536ef96
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 46 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

25
src/components/views/beacon/LeftPanelLiveShareWarning.tsx
View file

@ -15,8 +15,8 @@ limitations under the License.
*/
import classNames from 'classnames';
import React from 'react';
import { BeaconIdentifier, Room } from 'matrix-js-sdk/src/matrix';
import React, { useEffect } from 'react';
import { Beacon, BeaconIdentifier, Room } from 'matrix-js-sdk/src/matrix';
import { useEventEmitterState } from '../../../hooks/useEventEmitter';
import { _t } from '../../../languageHandler';
@ -61,6 +61,25 @@ const getLabel = (hasStoppingErrors: boolean, hasLocationErrors: boolean): strin
return _t('You are sharing your live location');
};
const useLivenessMonitor = (liveBeaconIds: BeaconIdentifier[], beacons: Map<BeaconIdentifier, Beacon>): void => {
useEffect(() => {
// chromium sets the minimum timer interval to 1000ms
// for inactive tabs
// refresh beacon monitors when the tab becomes active again
const onPageVisibilityChanged = () => {
if (document.visibilityState === 'visible') {
liveBeaconIds.map(identifier => beacons.get(identifier)?.monitorLiveness());
}
};
if (liveBeaconIds.length) {
document.addEventListener("visibilitychange", onPageVisibilityChanged);
}
() => {
document.removeEventListener("visibilitychange", onPageVisibilityChanged);
};
}, [liveBeaconIds, beacons]);
};
const LeftPanelLiveShareWarning: React.FC<Props> = ({ isMinimized }) => {
const isMonitoringLiveLocation = useEventEmitterState(
OwnBeaconStore.instance,
@ -91,6 +110,8 @@ const LeftPanelLiveShareWarning: React.FC<Props> = ({ isMinimized }) => {
const hasLocationPublishErrors = !!beaconIdsWithLocationPublishError.length;
const hasStoppingErrors = !!beaconIdsWithStoppingError.length;
useLivenessMonitor(liveBeaconIds, OwnBeaconStore.instance.beacons);
if (!isMonitoringLiveLocation) {
return null;
}

23
test/components/views/beacon/LeftPanelLiveShareWarning-test.tsx
View file

@ -34,6 +34,7 @@ jest.mock('../../../../src/stores/OwnBeaconStore', () => {
public getBeaconById = jest.fn();
public getLiveBeaconIds = jest.fn().mockReturnValue([]);
public readonly beaconUpdateErrors = new Map<BeaconIdentifier, Error>();
public readonly beacons = new Map<BeaconIdentifier, Beacon>();
}
return {
// @ts-ignore
@ -103,6 +104,10 @@ describe('<LeftPanelLiveShareWarning />', () => {
mocked(OwnBeaconStore.instance).getLiveBeaconIds.mockReturnValue([beacon2.identifier, beacon1.identifier]);
});
afterAll(() => {
jest.spyOn(document, 'addEventListener').mockRestore();
});
it('renders correctly when not minimized', () => {
const component = getComponent();
expect(component).toMatchSnapshot();
@ -195,6 +200,24 @@ describe('<LeftPanelLiveShareWarning />', () => {
expect(component.html()).toBe(null);
});
it('refreshes beacon liveness monitors when pagevisibilty changes to visible', () => {
OwnBeaconStore.instance.beacons.set(beacon1.identifier, beacon1);
OwnBeaconStore.instance.beacons.set(beacon2.identifier, beacon2);
const beacon1MonitorSpy = jest.spyOn(beacon1, 'monitorLiveness');
const beacon2MonitorSpy = jest.spyOn(beacon1, 'monitorLiveness');
jest.spyOn(document, 'addEventListener').mockImplementation(
(_e, listener) => (listener as EventListener)(new Event('')),
);
expect(beacon1MonitorSpy).not.toHaveBeenCalled();
getComponent();
expect(beacon1MonitorSpy).toHaveBeenCalled();
expect(beacon2MonitorSpy).toHaveBeenCalled();
});
describe('stopping errors', () => {
it('renders stopping error', () => {
OwnBeaconStore.instance.beaconUpdateErrors.set(beacon2.identifier, new Error('error'));