Avoid rendering app download buttons if disabled in config (#11741)
* Add default desktop_builds and mobile_builds into SdkConfig.DEFAULTS Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Avoid rendering app download buttons if config sets to `null` Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Disable app download onboarding task if config has no apps to download Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Add tests and update types Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Fix types Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --------- Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
This commit is contained in:
Michael Telatynski
GitHub
parent
e22fa2efc1
commit
bdf2ebd301
7 changed files with 723 additions and 70 deletions
80
test/components/views/dialogs/AppDownloadDialog-test.tsx
Normal file
80
test/components/views/dialogs/AppDownloadDialog-test.tsx
Normal file
|
|
@ -0,0 +1,80 @@
|
|||
/*
|
||||
Copyright 2023 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 { render, screen } from "@testing-library/react";
|
||||
|
||||
import { AppDownloadDialog } from "../../../../src/components/views/dialogs/AppDownloadDialog";
|
||||
import SdkConfig, { ConfigOptions } from "../../../../src/SdkConfig";
|
||||
|
||||
describe("AppDownloadDialog", () => {
|
||||
afterEach(() => {
|
||||
SdkConfig.reset();
|
||||
});
|
||||
|
||||
it("should render with desktop, ios, android, fdroid buttons by default", () => {
|
||||
const { asFragment } = render(<AppDownloadDialog onFinished={jest.fn()} />);
|
||||
expect(screen.queryByRole("button", { name: "Download Element Desktop" })).toBeInTheDocument();
|
||||
expect(screen.queryByRole("button", { name: "Download on the App Store" })).toBeInTheDocument();
|
||||
expect(screen.queryByRole("button", { name: "Get it on Google Play" })).toBeInTheDocument();
|
||||
expect(screen.queryByRole("button", { name: "Get it on F-Droid" })).toBeInTheDocument();
|
||||
expect(asFragment()).toMatchSnapshot();
|
||||
});
|
||||
|
||||
it("should allow disabling fdroid build", () => {
|
||||
SdkConfig.add({
|
||||
mobile_builds: {
|
||||
fdroid: null,
|
||||
},
|
||||
} as ConfigOptions);
|
||||
const { asFragment } = render(<AppDownloadDialog onFinished={jest.fn()} />);
|
||||
expect(screen.queryByRole("button", { name: "Download Element Desktop" })).toBeInTheDocument();
|
||||
expect(screen.queryByRole("button", { name: "Download on the App Store" })).toBeInTheDocument();
|
||||
expect(screen.queryByRole("button", { name: "Get it on Google Play" })).toBeInTheDocument();
|
||||
expect(screen.queryByRole("button", { name: "Get it on F-Droid" })).not.toBeInTheDocument();
|
||||
expect(asFragment()).toMatchSnapshot();
|
||||
});
|
||||
|
||||
it("should allow disabling desktop build", () => {
|
||||
SdkConfig.add({
|
||||
desktop_builds: {
|
||||
available: false,
|
||||
},
|
||||
} as ConfigOptions);
|
||||
const { asFragment } = render(<AppDownloadDialog onFinished={jest.fn()} />);
|
||||
expect(screen.queryByRole("button", { name: "Download Element Desktop" })).not.toBeInTheDocument();
|
||||
expect(screen.queryByRole("button", { name: "Download on the App Store" })).toBeInTheDocument();
|
||||
expect(screen.queryByRole("button", { name: "Get it on Google Play" })).toBeInTheDocument();
|
||||
expect(screen.queryByRole("button", { name: "Get it on F-Droid" })).toBeInTheDocument();
|
||||
expect(asFragment()).toMatchSnapshot();
|
||||
});
|
||||
|
||||
it("should allow disabling mobile builds", () => {
|
||||
SdkConfig.add({
|
||||
mobile_builds: {
|
||||
ios: null,
|
||||
android: null,
|
||||
fdroid: null,
|
||||
},
|
||||
} as ConfigOptions);
|
||||
const { asFragment } = render(<AppDownloadDialog onFinished={jest.fn()} />);
|
||||
expect(screen.queryByRole("button", { name: "Download Element Desktop" })).toBeInTheDocument();
|
||||
expect(screen.queryByRole("button", { name: "Download on the App Store" })).not.toBeInTheDocument();
|
||||
expect(screen.queryByRole("button", { name: "Get it on Google Play" })).not.toBeInTheDocument();
|
||||
expect(screen.queryByRole("button", { name: "Get it on F-Droid" })).not.toBeInTheDocument();
|
||||
expect(asFragment()).toMatchSnapshot();
|
||||
});
|
||||
});
|
||||
|
|
@ -0,0 +1,540 @@
|
|||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`AppDownloadDialog should allow disabling desktop build 1`] = `
|
||||
<DocumentFragment>
|
||||
<div
|
||||
data-focus-guard="true"
|
||||
style="width: 1px; height: 0px; padding: 0px; overflow: hidden; position: fixed; top: 1px; left: 1px;"
|
||||
tabindex="0"
|
||||
/>
|
||||
<div
|
||||
aria-labelledby="mx_BaseDialog_title"
|
||||
class="mx_AppDownloadDialog mx_Dialog_fixedWidth"
|
||||
data-focus-lock-disabled="false"
|
||||
role="dialog"
|
||||
>
|
||||
<div
|
||||
class="mx_Dialog_header mx_Dialog_headerWithCancel"
|
||||
>
|
||||
<h2
|
||||
class="mx_Heading_h3 mx_Dialog_title"
|
||||
id="mx_BaseDialog_title"
|
||||
>
|
||||
Download Element
|
||||
</h2>
|
||||
<div
|
||||
aria-label="Close dialog"
|
||||
class="mx_AccessibleButton mx_Dialog_cancelButton"
|
||||
role="button"
|
||||
tabindex="0"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
class="mx_AppDownloadDialog_mobile"
|
||||
>
|
||||
<div
|
||||
class="mx_AppDownloadDialog_app"
|
||||
>
|
||||
<h3
|
||||
class="mx_Heading_h3"
|
||||
>
|
||||
iOS
|
||||
</h3>
|
||||
<div
|
||||
class="mx_QRCode"
|
||||
>
|
||||
<div
|
||||
class="mx_Spinner"
|
||||
>
|
||||
<div
|
||||
aria-label="Loading…"
|
||||
class="mx_Spinner_icon"
|
||||
data-testid="spinner"
|
||||
role="progressbar"
|
||||
style="width: 32px; height: 32px;"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="mx_AppDownloadDialog_info"
|
||||
>
|
||||
or
|
||||
</div>
|
||||
<div
|
||||
class="mx_AppDownloadDialog_links"
|
||||
>
|
||||
<a
|
||||
aria-label="Download on the App Store"
|
||||
class="mx_AccessibleButton"
|
||||
href="https://apps.apple.com/app/vector/id1083446067"
|
||||
role="button"
|
||||
tabindex="0"
|
||||
target="_blank"
|
||||
>
|
||||
<div />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="mx_AppDownloadDialog_app"
|
||||
>
|
||||
<h3
|
||||
class="mx_Heading_h3"
|
||||
>
|
||||
Android
|
||||
</h3>
|
||||
<div
|
||||
class="mx_QRCode"
|
||||
>
|
||||
<div
|
||||
class="mx_Spinner"
|
||||
>
|
||||
<div
|
||||
aria-label="Loading…"
|
||||
class="mx_Spinner_icon"
|
||||
data-testid="spinner"
|
||||
role="progressbar"
|
||||
style="width: 32px; height: 32px;"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="mx_AppDownloadDialog_info"
|
||||
>
|
||||
or
|
||||
</div>
|
||||
<div
|
||||
class="mx_AppDownloadDialog_links"
|
||||
>
|
||||
<a
|
||||
aria-label="Get it on Google Play"
|
||||
class="mx_AccessibleButton"
|
||||
href="https://play.google.com/store/apps/details?id=im.vector.app"
|
||||
role="button"
|
||||
tabindex="0"
|
||||
target="_blank"
|
||||
>
|
||||
<div />
|
||||
</a>
|
||||
<a
|
||||
aria-label="Get it on F-Droid"
|
||||
class="mx_AccessibleButton"
|
||||
href="https://f-droid.org/repository/browse/?fdid=im.vector.app"
|
||||
role="button"
|
||||
tabindex="0"
|
||||
target="_blank"
|
||||
>
|
||||
<div />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="mx_AppDownloadDialog_legal"
|
||||
>
|
||||
<p>
|
||||
App Store® and the Apple logo® are trademarks of Apple Inc.
|
||||
</p>
|
||||
<p>
|
||||
Google Play and the Google Play logo are trademarks of Google LLC.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
data-focus-guard="true"
|
||||
style="width: 1px; height: 0px; padding: 0px; overflow: hidden; position: fixed; top: 1px; left: 1px;"
|
||||
tabindex="0"
|
||||
/>
|
||||
</DocumentFragment>
|
||||
`;
|
||||
|
||||
exports[`AppDownloadDialog should allow disabling fdroid build 1`] = `
|
||||
<DocumentFragment>
|
||||
<div
|
||||
data-focus-guard="true"
|
||||
style="width: 1px; height: 0px; padding: 0px; overflow: hidden; position: fixed; top: 1px; left: 1px;"
|
||||
tabindex="0"
|
||||
/>
|
||||
<div
|
||||
aria-labelledby="mx_BaseDialog_title"
|
||||
class="mx_AppDownloadDialog mx_Dialog_fixedWidth"
|
||||
data-focus-lock-disabled="false"
|
||||
role="dialog"
|
||||
>
|
||||
<div
|
||||
class="mx_Dialog_header mx_Dialog_headerWithCancel"
|
||||
>
|
||||
<h2
|
||||
class="mx_Heading_h3 mx_Dialog_title"
|
||||
id="mx_BaseDialog_title"
|
||||
>
|
||||
Download Element
|
||||
</h2>
|
||||
<div
|
||||
aria-label="Close dialog"
|
||||
class="mx_AccessibleButton mx_Dialog_cancelButton"
|
||||
role="button"
|
||||
tabindex="0"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
class="mx_AppDownloadDialog_desktop"
|
||||
>
|
||||
<h3
|
||||
class="mx_Heading_h3"
|
||||
>
|
||||
Download Element Desktop
|
||||
</h3>
|
||||
<a
|
||||
class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary"
|
||||
href="https://element.io/download"
|
||||
role="button"
|
||||
tabindex="0"
|
||||
target="_blank"
|
||||
>
|
||||
Download Element Desktop
|
||||
</a>
|
||||
</div>
|
||||
<div
|
||||
class="mx_AppDownloadDialog_mobile"
|
||||
>
|
||||
<div
|
||||
class="mx_AppDownloadDialog_app"
|
||||
>
|
||||
<h3
|
||||
class="mx_Heading_h3"
|
||||
>
|
||||
iOS
|
||||
</h3>
|
||||
<div
|
||||
class="mx_QRCode"
|
||||
>
|
||||
<div
|
||||
class="mx_Spinner"
|
||||
>
|
||||
<div
|
||||
aria-label="Loading…"
|
||||
class="mx_Spinner_icon"
|
||||
data-testid="spinner"
|
||||
role="progressbar"
|
||||
style="width: 32px; height: 32px;"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="mx_AppDownloadDialog_info"
|
||||
>
|
||||
or
|
||||
</div>
|
||||
<div
|
||||
class="mx_AppDownloadDialog_links"
|
||||
>
|
||||
<a
|
||||
aria-label="Download on the App Store"
|
||||
class="mx_AccessibleButton"
|
||||
href="https://apps.apple.com/app/vector/id1083446067"
|
||||
role="button"
|
||||
tabindex="0"
|
||||
target="_blank"
|
||||
>
|
||||
<div />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="mx_AppDownloadDialog_app"
|
||||
>
|
||||
<h3
|
||||
class="mx_Heading_h3"
|
||||
>
|
||||
Android
|
||||
</h3>
|
||||
<div
|
||||
class="mx_QRCode"
|
||||
>
|
||||
<div
|
||||
class="mx_Spinner"
|
||||
>
|
||||
<div
|
||||
aria-label="Loading…"
|
||||
class="mx_Spinner_icon"
|
||||
data-testid="spinner"
|
||||
role="progressbar"
|
||||
style="width: 32px; height: 32px;"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="mx_AppDownloadDialog_info"
|
||||
>
|
||||
or
|
||||
</div>
|
||||
<div
|
||||
class="mx_AppDownloadDialog_links"
|
||||
>
|
||||
<a
|
||||
aria-label="Get it on Google Play"
|
||||
class="mx_AccessibleButton"
|
||||
href="https://play.google.com/store/apps/details?id=im.vector.app"
|
||||
role="button"
|
||||
tabindex="0"
|
||||
target="_blank"
|
||||
>
|
||||
<div />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="mx_AppDownloadDialog_legal"
|
||||
>
|
||||
<p>
|
||||
App Store® and the Apple logo® are trademarks of Apple Inc.
|
||||
</p>
|
||||
<p>
|
||||
Google Play and the Google Play logo are trademarks of Google LLC.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
data-focus-guard="true"
|
||||
style="width: 1px; height: 0px; padding: 0px; overflow: hidden; position: fixed; top: 1px; left: 1px;"
|
||||
tabindex="0"
|
||||
/>
|
||||
</DocumentFragment>
|
||||
`;
|
||||
|
||||
exports[`AppDownloadDialog should allow disabling mobile builds 1`] = `
|
||||
<DocumentFragment>
|
||||
<div
|
||||
data-focus-guard="true"
|
||||
style="width: 1px; height: 0px; padding: 0px; overflow: hidden; position: fixed; top: 1px; left: 1px;"
|
||||
tabindex="0"
|
||||
/>
|
||||
<div
|
||||
aria-labelledby="mx_BaseDialog_title"
|
||||
class="mx_AppDownloadDialog mx_Dialog_fixedWidth"
|
||||
data-focus-lock-disabled="false"
|
||||
role="dialog"
|
||||
>
|
||||
<div
|
||||
class="mx_Dialog_header mx_Dialog_headerWithCancel"
|
||||
>
|
||||
<h2
|
||||
class="mx_Heading_h3 mx_Dialog_title"
|
||||
id="mx_BaseDialog_title"
|
||||
>
|
||||
Download Element
|
||||
</h2>
|
||||
<div
|
||||
aria-label="Close dialog"
|
||||
class="mx_AccessibleButton mx_Dialog_cancelButton"
|
||||
role="button"
|
||||
tabindex="0"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
class="mx_AppDownloadDialog_desktop"
|
||||
>
|
||||
<h3
|
||||
class="mx_Heading_h3"
|
||||
>
|
||||
Download Element Desktop
|
||||
</h3>
|
||||
<a
|
||||
class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary"
|
||||
href="https://element.io/download"
|
||||
role="button"
|
||||
tabindex="0"
|
||||
target="_blank"
|
||||
>
|
||||
Download Element Desktop
|
||||
</a>
|
||||
</div>
|
||||
<div
|
||||
class="mx_AppDownloadDialog_mobile"
|
||||
/>
|
||||
<div
|
||||
class="mx_AppDownloadDialog_legal"
|
||||
>
|
||||
<p>
|
||||
App Store® and the Apple logo® are trademarks of Apple Inc.
|
||||
</p>
|
||||
<p>
|
||||
Google Play and the Google Play logo are trademarks of Google LLC.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
data-focus-guard="true"
|
||||
style="width: 1px; height: 0px; padding: 0px; overflow: hidden; position: fixed; top: 1px; left: 1px;"
|
||||
tabindex="0"
|
||||
/>
|
||||
</DocumentFragment>
|
||||
`;
|
||||
|
||||
exports[`AppDownloadDialog should render with desktop, ios, android, fdroid buttons by default 1`] = `
|
||||
<DocumentFragment>
|
||||
<div
|
||||
data-focus-guard="true"
|
||||
style="width: 1px; height: 0px; padding: 0px; overflow: hidden; position: fixed; top: 1px; left: 1px;"
|
||||
tabindex="0"
|
||||
/>
|
||||
<div
|
||||
aria-labelledby="mx_BaseDialog_title"
|
||||
class="mx_AppDownloadDialog mx_Dialog_fixedWidth"
|
||||
data-focus-lock-disabled="false"
|
||||
role="dialog"
|
||||
>
|
||||
<div
|
||||
class="mx_Dialog_header mx_Dialog_headerWithCancel"
|
||||
>
|
||||
<h2
|
||||
class="mx_Heading_h3 mx_Dialog_title"
|
||||
id="mx_BaseDialog_title"
|
||||
>
|
||||
Download Element
|
||||
</h2>
|
||||
<div
|
||||
aria-label="Close dialog"
|
||||
class="mx_AccessibleButton mx_Dialog_cancelButton"
|
||||
role="button"
|
||||
tabindex="0"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
class="mx_AppDownloadDialog_desktop"
|
||||
>
|
||||
<h3
|
||||
class="mx_Heading_h3"
|
||||
>
|
||||
Download Element Desktop
|
||||
</h3>
|
||||
<a
|
||||
class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary"
|
||||
href="https://element.io/download"
|
||||
role="button"
|
||||
tabindex="0"
|
||||
target="_blank"
|
||||
>
|
||||
Download Element Desktop
|
||||
</a>
|
||||
</div>
|
||||
<div
|
||||
class="mx_AppDownloadDialog_mobile"
|
||||
>
|
||||
<div
|
||||
class="mx_AppDownloadDialog_app"
|
||||
>
|
||||
<h3
|
||||
class="mx_Heading_h3"
|
||||
>
|
||||
iOS
|
||||
</h3>
|
||||
<div
|
||||
class="mx_QRCode"
|
||||
>
|
||||
<div
|
||||
class="mx_Spinner"
|
||||
>
|
||||
<div
|
||||
aria-label="Loading…"
|
||||
class="mx_Spinner_icon"
|
||||
data-testid="spinner"
|
||||
role="progressbar"
|
||||
style="width: 32px; height: 32px;"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="mx_AppDownloadDialog_info"
|
||||
>
|
||||
or
|
||||
</div>
|
||||
<div
|
||||
class="mx_AppDownloadDialog_links"
|
||||
>
|
||||
<a
|
||||
aria-label="Download on the App Store"
|
||||
class="mx_AccessibleButton"
|
||||
href="https://apps.apple.com/app/vector/id1083446067"
|
||||
role="button"
|
||||
tabindex="0"
|
||||
target="_blank"
|
||||
>
|
||||
<div />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="mx_AppDownloadDialog_app"
|
||||
>
|
||||
<h3
|
||||
class="mx_Heading_h3"
|
||||
>
|
||||
Android
|
||||
</h3>
|
||||
<div
|
||||
class="mx_QRCode"
|
||||
>
|
||||
<div
|
||||
class="mx_Spinner"
|
||||
>
|
||||
<div
|
||||
aria-label="Loading…"
|
||||
class="mx_Spinner_icon"
|
||||
data-testid="spinner"
|
||||
role="progressbar"
|
||||
style="width: 32px; height: 32px;"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="mx_AppDownloadDialog_info"
|
||||
>
|
||||
or
|
||||
</div>
|
||||
<div
|
||||
class="mx_AppDownloadDialog_links"
|
||||
>
|
||||
<a
|
||||
aria-label="Get it on Google Play"
|
||||
class="mx_AccessibleButton"
|
||||
href="https://play.google.com/store/apps/details?id=im.vector.app"
|
||||
role="button"
|
||||
tabindex="0"
|
||||
target="_blank"
|
||||
>
|
||||
<div />
|
||||
</a>
|
||||
<a
|
||||
aria-label="Get it on F-Droid"
|
||||
class="mx_AccessibleButton"
|
||||
href="https://f-droid.org/repository/browse/?fdid=im.vector.app"
|
||||
role="button"
|
||||
tabindex="0"
|
||||
target="_blank"
|
||||
>
|
||||
<div />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="mx_AppDownloadDialog_legal"
|
||||
>
|
||||
<p>
|
||||
App Store® and the Apple logo® are trademarks of Apple Inc.
|
||||
</p>
|
||||
<p>
|
||||
Google Play and the Google Play logo are trademarks of Google LLC.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
data-focus-guard="true"
|
||||
style="width: 1px; height: 0px; padding: 0px; overflow: hidden; position: fixed; top: 1px; left: 1px;"
|
||||
tabindex="0"
|
||||
/>
|
||||
</DocumentFragment>
|
||||
`;
|
||||
Loading…
Add table
Add a link
Reference in a new issue