Use semantic headings in user settings - integrations and account deletion (#10837)
* allow testids in settings sections * use semantic headings in LabsUserSettingsTab * put back margin var * use SettingsTab wrapper * use semantic headings for deactivate acc section * use semantic heading in manage integratios * i18n * explicit cast to boolean * Update src/components/views/settings/shared/SettingsSubsection.tsx Co-authored-by: Richard van der Hoff <1389908+richvdh@users.noreply.github.com> * test manage integration settings * test deactivate account section display * remove debug * fix cypress test --------- Co-authored-by: Richard van der Hoff <1389908+richvdh@users.noreply.github.com>
This commit is contained in:
parent
c3687489dd
commit
8cd84b0e7b
7 changed files with 232 additions and 54 deletions
|
@ -43,7 +43,7 @@ describe("General user settings tab", () => {
|
|||
// Exclude userId from snapshots
|
||||
const percyCSS = ".mx_ProfileSettings_profile_controls_userId { visibility: hidden !important; }";
|
||||
|
||||
cy.get(".mx_SettingsTab.mx_GeneralUserSettingsTab").percySnapshotElement("User settings tab - General", {
|
||||
cy.findByTestId("mx_GeneralUserSettingsTab").percySnapshotElement("User settings tab - General", {
|
||||
percyCSS,
|
||||
// Emulate TabbedView's actual min and max widths
|
||||
// 580: '.mx_UserSettingsDialog .mx_TabbedView' min-width
|
||||
|
@ -51,7 +51,7 @@ describe("General user settings tab", () => {
|
|||
widths: [580, 796],
|
||||
});
|
||||
|
||||
cy.get(".mx_SettingsTab.mx_GeneralUserSettingsTab").within(() => {
|
||||
cy.findByTestId("mx_GeneralUserSettingsTab").within(() => {
|
||||
// Assert that the top heading is rendered
|
||||
cy.findByTestId("general").should("have.text", "General").should("be.visible");
|
||||
|
||||
|
@ -156,16 +156,10 @@ describe("General user settings tab", () => {
|
|||
// Make sure integration manager's toggle switch is enabled
|
||||
cy.get(".mx_ToggleSwitch_enabled").should("be.visible");
|
||||
|
||||
// Assert space between "Manage integrations" and the integration server address is set to 4px;
|
||||
cy.get(".mx_SetIntegrationManager_heading_manager").should("have.css", "column-gap", "4px");
|
||||
|
||||
cy.get(".mx_SetIntegrationManager_heading_manager").within(() => {
|
||||
cy.get(".mx_SettingsTab_heading").should("have.text", "Manage integrations");
|
||||
|
||||
// Assert the headings' inline end margin values are set to zero in favor of the column-gap declaration
|
||||
cy.get(".mx_SettingsTab_heading").should("have.css", "margin-inline-end", "0px");
|
||||
cy.get(".mx_SettingsTab_subheading").should("have.css", "margin-inline-end", "0px");
|
||||
});
|
||||
cy.get(".mx_SetIntegrationManager_heading_manager").should(
|
||||
"have.text",
|
||||
"Manage integrations(scalar.vector.im)",
|
||||
);
|
||||
});
|
||||
|
||||
// Assert the account deactivation button is displayed
|
||||
|
@ -178,7 +172,7 @@ describe("General user settings tab", () => {
|
|||
});
|
||||
|
||||
it("should support adding and removing a profile picture", () => {
|
||||
cy.get(".mx_SettingsTab.mx_GeneralUserSettingsTab .mx_ProfileSettings").within(() => {
|
||||
cy.get(".mx_SettingsTab .mx_ProfileSettings").within(() => {
|
||||
// Upload a picture
|
||||
cy.get(".mx_ProfileSettings_avatarUpload").selectFile("cypress/fixtures/riot.png", { force: true });
|
||||
|
||||
|
@ -225,7 +219,7 @@ describe("General user settings tab", () => {
|
|||
});
|
||||
|
||||
it("should support changing a display name", () => {
|
||||
cy.get(".mx_SettingsTab.mx_GeneralUserSettingsTab .mx_ProfileSettings").within(() => {
|
||||
cy.get(".mx_SettingsTab .mx_ProfileSettings").within(() => {
|
||||
// Change the diaplay name to USER_NAME_NEW
|
||||
cy.findByRole("textbox", { name: "Display Name" }).type(`{selectAll}{del}${USER_NAME_NEW}{enter}`);
|
||||
});
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue