PrivateCoffee/element-web
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 3

await promises (#10992)

Browse source
This commit is contained in:
Kerry 2023-05-29 10:19:37 +12:00 committed by GitHub
parent 3bba816b10
commit 9080f3dd55
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 58 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
src/components/views/settings/tabs/user/SidebarUserSettingsTab.tsx
View file

@ -34,9 +34,9 @@ import SettingsSubsection, { SettingsSubsectionText } from "../../shared/Setting
type InteractionName = "WebSettingsSidebarTabSpacesCheckbox" | "WebQuickSettingsPinToSidebarCheckbox";
export const onMetaSpaceChangeFactory =
(metaSpace: MetaSpace, interactionName: InteractionName) => (e: ChangeEvent<HTMLInputElement>) => {
(metaSpace: MetaSpace, interactionName: InteractionName) => async (e: ChangeEvent<HTMLInputElement>) => {
const currentValue = SettingsStore.getValue("Spaces.enabledMetaSpaces");
SettingsStore.setValue("Spaces.enabledMetaSpaces", null, SettingLevel.ACCOUNT, {
await SettingsStore.setValue("Spaces.enabledMetaSpaces", null, SettingLevel.ACCOUNT, {
...currentValue,
[metaSpace]: e.target.checked,
});

37
src/components/views/settings/tabs/user/VoiceUserSettingsTab.tsx
View file

@ -16,6 +16,7 @@ limitations under the License.
*/
import React, { ReactNode } from "react";
import { logger } from "matrix-js-sdk/src/logger";
import { _t } from "../../../../../languageHandler";
import MediaDeviceHandler, { IMediaDevices, MediaDeviceKindEnum } from "../../../../../MediaDeviceHandler";
@ -40,6 +41,21 @@ interface IState {
audioNoiseSuppression: boolean;
}
/**
* Maps deviceKind to the right get method on MediaDeviceHandler
* Helpful for setting state
*/
const mapDeviceKindToHandlerValue = (deviceKind: MediaDeviceKindEnum): string | null => {
switch (deviceKind) {
case MediaDeviceKindEnum.AudioOutput:
return MediaDeviceHandler.getAudioOutput();
case MediaDeviceKindEnum.AudioInput:
return MediaDeviceHandler.getAudioInput();
case MediaDeviceKindEnum.VideoInput:
return MediaDeviceHandler.getVideoInput();
}
};
export default class VoiceUserSettingsTab extends React.Component<{}, IState> {
public constructor(props: {}) {
super(props);
@ -58,16 +74,16 @@ export default class VoiceUserSettingsTab extends React.Component<{}, IState> {
public async componentDidMount(): Promise<void> {
const canSeeDeviceLabels = await MediaDeviceHandler.hasAnyLabeledDevices();
if (canSeeDeviceLabels) {
this.refreshMediaDevices();
await this.refreshMediaDevices();
}
}
private refreshMediaDevices = async (stream?: MediaStream): Promise<void> => {
this.setState({
mediaDevices: (await MediaDeviceHandler.getDevices()) ?? null,
[MediaDeviceKindEnum.AudioOutput]: MediaDeviceHandler.getAudioOutput(),
[MediaDeviceKindEnum.AudioInput]: MediaDeviceHandler.getAudioInput(),
[MediaDeviceKindEnum.VideoInput]: MediaDeviceHandler.getVideoInput(),
[MediaDeviceKindEnum.AudioOutput]: mapDeviceKindToHandlerValue(MediaDeviceKindEnum.AudioOutput),
[MediaDeviceKindEnum.AudioInput]: mapDeviceKindToHandlerValue(MediaDeviceKindEnum.AudioInput),
[MediaDeviceKindEnum.VideoInput]: mapDeviceKindToHandlerValue(MediaDeviceKindEnum.VideoInput),
});
if (stream) {
// kill stream (after we've enumerated the devices, otherwise we'd get empty labels again)
@ -80,13 +96,20 @@ export default class VoiceUserSettingsTab extends React.Component<{}, IState> {
private requestMediaPermissions = async (): Promise<void> => {
const stream = await requestMediaPermissions();
if (stream) {
this.refreshMediaDevices(stream);
await this.refreshMediaDevices(stream);
}
};
private setDevice = (deviceId: string, kind: MediaDeviceKindEnum): void => {
MediaDeviceHandler.instance.setDevice(deviceId, kind);
private setDevice = async (deviceId: string, kind: MediaDeviceKindEnum): Promise<void> => {
// set state immediately so UI is responsive
this.setState<any>({ [kind]: deviceId });
try {
await MediaDeviceHandler.instance.setDevice(deviceId, kind);
} catch (error) {
logger.error(`Failed to set device ${kind}: ${deviceId}`);
// reset state to current value
this.setState<any>({ [kind]: mapDeviceKindToHandlerValue(kind) });
}
};
private changeWebRtcMethod = (p2p: boolean): void => {

27
test/components/views/settings/tabs/user/VoiceUserSettingsTab-test.tsx
View file

@ -17,6 +17,7 @@ limitations under the License.
import React from "react";
import { mocked } from "jest-mock";
import { fireEvent, render, screen } from "@testing-library/react";
import { logger } from "matrix-js-sdk/src/logger";
import VoiceUserSettingsTab from "../../../../../../src/components/views/settings/tabs/user/VoiceUserSettingsTab";
import MediaDeviceHandler, { IMediaDevices, MediaDeviceKindEnum } from "../../../../../../src/MediaDeviceHandler";
@ -56,9 +57,10 @@ describe("<VoiceUserSettingsTab />", () => {
jest.clearAllMocks();
MediaDeviceHandlerMock.hasAnyLabeledDevices.mockResolvedValue(true);
MediaDeviceHandlerMock.getDevices.mockResolvedValue(defaultMediaDevices);
MediaDeviceHandlerMock.getVideoInput.mockReturnValue(videoIn1.deviceId);
// @ts-ignore bad mocking
MediaDeviceHandlerMock.instance = { setDevice: jest.fn() };
MediaDeviceHandlerMock.instance = { setDevice: jest.fn().mockResolvedValue(undefined) };
});
describe("devices", () => {
@ -84,6 +86,29 @@ describe("<VoiceUserSettingsTab />", () => {
expect(screen.getByLabelText("Camera")).toHaveDisplayValue(videoIn2.label);
});
it("logs and resets device when update fails", async () => {
// stub to avoid littering console with expected error
jest.spyOn(logger, "error").mockImplementation(() => {});
MediaDeviceHandlerMock.instance.setDevice.mockRejectedValue("oups!");
render(getComponent());
await flushPromises();
fireEvent.change(screen.getByLabelText("Camera"), { target: { value: videoIn2.deviceId } });
expect(MediaDeviceHandlerMock.instance.setDevice).toHaveBeenCalledWith(
videoIn2.deviceId,
MediaDeviceKindEnum.VideoInput,
);
expect(screen.getByLabelText("Camera")).toHaveDisplayValue(videoIn2.label);
await flushPromises();
expect(logger.error).toHaveBeenCalledWith("Failed to set device videoinput: 3");
// reset to original
expect(screen.getByLabelText("Camera")).toHaveDisplayValue(videoIn1.label);
});
it("does not render dropdown when no devices exist for type", async () => {
render(getComponent());
await flushPromises();