Allow local log downloads when a rageshake URL is not configured. (#31716)

* Add support for storing debug logs locally and allowing local downloads. * static * Comprehensive testing for bug report flow. * Driveby cleanup of typography * fix i18n * Improvements to UX * More testing * update snaps * linting * lint * Fix feedback * Fix boldnewss * fix bold * fix heading * Increase test coverage * remove focus * Don't show the FAQ depending on whether you can submit feedback. * move reset * fix err * Remove unused * update snap * Remove text * Bumping up that coverage * tidy * lint * update snap * Use a const * fix imports * Remove import in e2e test * whoops
2026-01-20 12:29:18 +00:00
parent b7a2e8c64e
commit a15efcc6d0
27 changed files with 692 additions and 162 deletions
--- a/test/unit-tests/components/views/dialogs/BugReportDialog-test.tsx
+++ b/test/unit-tests/components/views/dialogs/BugReportDialog-test.tsx
@@ -17,6 +17,7 @@ import BugReportDialog, {
 import SdkConfig from "../../../../../src/SdkConfig";
 import { type ConsoleLogger } from "../../../../../src/rageshake/rageshake";
 import SettingsStore from "../../../../../src/settings/SettingsStore";
+import { BugReportEndpointURLLocal } from "../../../../../src/IConfigOptions";

 const BUG_REPORT_URL = "https://example.org/submit";

@@ -69,7 +70,7 @@ describe("BugReportDialog", () => {

    it("can submit a bug report", async () => {
        const { getByLabelText, getByText } = renderComponent();
-        fetchMock.postOnce(BUG_REPORT_URL, { report_url: "https://exmaple.org/report/url" });
+        fetchMock.postOnce(BUG_REPORT_URL, { report_url: "https://example.org/report/url" });
        await userEvent.type(getByLabelText("GitHub issue"), "https://example.org/some/issue");
        await userEvent.type(getByLabelText("Notes"), "Additional text");
        await userEvent.click(getByText("Send logs"));
@@ -78,6 +79,14 @@ describe("BugReportDialog", () => {
        expect(fetchMock).toHaveFetched(BUG_REPORT_URL);
    });

+    it("renders when the config only allows local downloads", async () => {
+        SdkConfig.put({
+            bug_report_endpoint_url: BugReportEndpointURLLocal,
+        });
+        const { container } = renderComponent();
+        expect(container).toMatchSnapshot("local-bug-reporter");
+    });
+
    it.each([
        {
            errcode: undefined,
--- a/test/unit-tests/components/views/dialogs/snapshots/BugReportDialog-test.tsx.snap
+++ b/test/unit-tests/components/views/dialogs/snapshots/BugReportDialog-test.tsx.snap
@@ -0,0 +1,77 @@
+// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
+
+exports[`BugReportDialog renders when the config only allows local downloads: local-bug-reporter 1`] = `
+<div>
+  <div
+    data-focus-guard="true"
+    style="width: 1px; height: 0px; padding: 0px; overflow: hidden; position: fixed; top: 1px; left: 1px;"
+    tabindex="0"
+  />
+  <div
+    aria-describedby="mx_Dialog_content"
+    aria-labelledby="mx_BaseDialog_title"
+    class="mx_BugReportDialog mx_Dialog_fixedWidth"
+    data-focus-lock-disabled="false"
+    role="dialog"
+    tabindex="-1"
+  >
+    <div
+      class="mx_Dialog_header"
+    >
+      <h1
+        class="mx_Heading_h3 mx_Dialog_title"
+        id="mx_BaseDialog_title"
+      >
+        Download logs
+      </h1>
+    </div>
+    <div
+      class="mx_Dialog_content"
+      id="mx_Dialog_content"
+    >
+      <p
+        class="_typography_6v6n8_153 _font-body-md-semibold_6v6n8_55"
+      >
+        Reminder: Your browser is unsupported, so your experience may be unpredictable.
+      </p>
+      <p
+        class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50"
+      >
+        Debug logs contain application usage data including your username, the IDs or aliases of the rooms you have visited, which UI elements you last interacted with, and the usernames of other users. They do not contain messages.
+      </p>
+    </div>
+    <div
+      class="mx_Dialog_buttons"
+    >
+      <span
+        class="mx_Dialog_buttons_row"
+      >
+        <button
+          data-testid="dialog-cancel-button"
+          type="button"
+        >
+          Cancel
+        </button>
+        <button
+          class="mx_Dialog_primary"
+          data-testid="dialog-primary-button"
+          type="button"
+        >
+          Download logs
+        </button>
+      </span>
+    </div>
+    <div
+      aria-label="Close dialog"
+      class="mx_AccessibleButton mx_Dialog_cancelButton"
+      role="button"
+      tabindex="0"
+    />
+  </div>
+  <div
+    data-focus-guard="true"
+    style="width: 1px; height: 0px; padding: 0px; overflow: hidden; position: fixed; top: 1px; left: 1px;"
+    tabindex="0"
+  />
+</div>
+`;
--- a/test/unit-tests/components/views/elements/BugReportDialogButton-test.tsx
+++ b/test/unit-tests/components/views/elements/BugReportDialogButton-test.tsx
@@ -0,0 +1,53 @@
+/*
+Copyright 2026 Element Creations Ltd.
+
+SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial
+Please see LICENSE files in the repository root for full details.
+*/
+
+import { render } from "jest-matrix-react";
+import React, { type ComponentProps } from "react";
+import { afterEach } from "node:test";
+import userEvent from "@testing-library/user-event";
+
+import { BugReportDialogButton } from "../../../../../src/components/views/elements/BugReportDialogButton";
+import SdkConfig from "../../../../../src/SdkConfig";
+import Modal from "../../../../../src/Modal";
+import BugReportDialog from "../../../../../src/components/views/dialogs/BugReportDialog";
+import { BugReportEndpointURLLocal } from "../../../../../src/IConfigOptions";
+
+describe("<BugReportDialogButton />", () => {
+    const getComponent = (props: ComponentProps<typeof BugReportDialogButton> = {}) =>
+        render(<BugReportDialogButton {...props} />);
+
+    afterEach(() => {
+        SdkConfig.reset();
+        jest.restoreAllMocks();
+    });
+
+    it("renders nothing if the bug reporter is disabled", () => {
+        SdkConfig.put({ bug_report_endpoint_url: undefined });
+        const { container } = getComponent({});
+        expect(container).toBeEmptyDOMElement();
+    });
+
+    it("renders 'submit' label if a URL is configured", () => {
+        SdkConfig.put({ bug_report_endpoint_url: "https://example.org" });
+        const { container } = getComponent({});
+        expect(container).toMatchSnapshot();
+    });
+
+    it("renders 'download' label if 'loca' is configured", () => {
+        SdkConfig.put({ bug_report_endpoint_url: BugReportEndpointURLLocal });
+        const { container } = getComponent({});
+        expect(container).toMatchSnapshot();
+    });
+
+    it("passes through props to dialog", async () => {
+        SdkConfig.put({ bug_report_endpoint_url: BugReportEndpointURLLocal });
+        const spy = jest.spyOn(Modal, "createDialog");
+        const { getByRole } = getComponent({ label: "a label", error: "an error" });
+        await userEvent.click(getByRole("button"));
+        expect(spy).toHaveBeenCalledWith(BugReportDialog, { error: "an error", label: "a label" });
+    });
+});
--- a/test/unit-tests/components/views/elements/snapshots/BugReportDialogButton-test.tsx.snap
+++ b/test/unit-tests/components/views/elements/snapshots/BugReportDialogButton-test.tsx.snap
@@ -0,0 +1,29 @@
+// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
+
+exports[`<BugReportDialogButton /> renders 'download' label if 'loca' is configured 1`] = `
+<div>
+  <button
+    class="_button_13vu4_8"
+    data-kind="secondary"
+    data-size="sm"
+    role="button"
+    tabindex="0"
+  >
+    Download logs
+  </button>
+</div>
+`;
+
+exports[`<BugReportDialogButton /> renders 'submit' label if a URL is configured 1`] = `
+<div>
+  <button
+    class="_button_13vu4_8"
+    data-kind="secondary"
+    data-size="sm"
+    role="button"
+    tabindex="0"
+  >
+    Submit debug logs
+  </button>
+</div>
+`;
--- a/test/unit-tests/components/views/settings/tabs/user/snapshots/LabsUserSettingsTab-test.tsx.snap
+++ b/test/unit-tests/components/views/settings/tabs/user/snapshots/LabsUserSettingsTab-test.tsx.snap
@@ -66,7 +66,20 @@ exports[`<LabsUserSettingsTab /> renders settings marked as beta as beta cards 1
          </div>
          <div
            class="mx_BetaCard_faq"
-          />
+          >
+            <h4>
+              How can I create a video room?
+            </h4>
+            <p>
+              Use the “+” button in the room section of the left panel.
+            </p>
+            <h4>
+              Can I use text chat alongside the video call?
+            </h4>
+            <p>
+              Yes, the chat timeline is displayed alongside the video.
+            </p>
+          </div>
        </div>
        <div
          class="mx_BetaCard_columns_image_wrapper"