Skip to content

Commit

Permalink
Add new Cypress tests for experience config form (#4747)
Browse files Browse the repository at this point in the history
  • Loading branch information
@jpople
jpople authored Mar 27, 2024
1 parent 6e9aa4f commit 0abceb3
Show file tree
Hide file tree
Showing 13 changed files with 518 additions and 180 deletions.
9 changes: 2 additions & 7 deletions clients/admin-ui/cypress/e2e/locations-regulations.cy.ts
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { stubPlus } from "cypress/support/stubs";
import { stubLocations, stubPlus } from "cypress/support/stubs";

import {
LOCATIONS_ROUTE,
Expand All @@ -23,12 +23,7 @@ describe("Locations and regulations", () => {
beforeEach(() => {
cy.login();
stubPlus(true);
cy.intercept("GET", "/api/v1/plus/locations", {
fixture: "locations/list.json",
}).as("getLocations");
cy.intercept("PATCH", "/api/v1/plus/locations", {
fixture: "locations/list.json",
}).as("patchLocations");
stubLocations();
});

describe("location continent view", () => {
Expand Down
217 changes: 183 additions & 34 deletions clients/admin-ui/cypress/e2e/privacy-experiences.cy.ts
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,9 @@
import { stubPlus, stubTranslationConfig } from "cypress/support/stubs";
import {
stubLocations,
stubPlus,
stubPrivacyNoticesCrud,
stubTranslationConfig,
} from "cypress/support/stubs";

import { PRIVACY_EXPERIENCE_ROUTE } from "~/features/common/nav/v2/routes";
import { RoleRegistryEnum } from "~/types/api";
Expand All @@ -12,6 +17,9 @@ describe("Privacy experiences", () => {
cy.intercept("GET", "/api/v1/experience-config*", {
fixture: "privacy-experiences/list.json",
}).as("getExperiences");
cy.intercept("GET", "/api/v1/experience-config/pri*", {
fixture: "privacy-experiences/experienceConfig.json",
}).as("getExperienceDetail");
stubPlus(true);
});

Expand Down Expand Up @@ -99,12 +107,17 @@ describe("Privacy experiences", () => {
});

it("can click a row to go to the experience page", () => {
cy.intercept("GET", "/api/v1/experience-config/pri*", {
fixture: "privacy-experiences/experienceConfig.json",
}).as("getExperienceDetail");
cy.get("table").contains("tr", "notice enabled test").click();
cy.wait("@getExperienceDetail");
cy.getByTestId("input-name").should("have.value", "Experience title");
cy.getByTestId("input-name").should(
"have.value",
"Example modal experience"
);
});

it("can click the button to create a new experience", () => {
cy.getByTestId("add-privacy-experience-btn").click();
cy.url().should("contain", "privacy-experience/new");
});

describe("enabling and disabling", () => {
Expand Down Expand Up @@ -157,38 +170,174 @@ describe("Privacy experiences", () => {
});

describe("forms", () => {
beforeEach(() => {
cy.intercept("PATCH", "/api/v1/experience-config/*", {
fixture: "privacy-experiences/experienceConfig.json",
}).as("patchExperience");
describe("creating a new experience config", () => {
beforeEach(() => {
stubPrivacyNoticesCrud();
stubLocations();
cy.visit(`${PRIVACY_EXPERIENCE_ROUTE}/new`);
cy.wait("@getNotices");
});

it("can create an experience", () => {
cy.getByTestId("input-name").type("Test experience name");
cy.selectOption("input-component", "Banner and modal");
cy.getByTestId("add-privacy-notice").click();
cy.getByTestId("select-privacy-notice").click();
cy.get(".select-privacy-notice__menu")
.find(".select-privacy-notice__option")
.first()
.click();
cy.getByTestId("add-location").click();
cy.getByTestId("select-location").click();
cy.get(".select-location__menu")
.find(".select-location__option")
.first()
.click();
cy.intercept("POST", "/api/v1/experience-config", {
statusCode: 200,
}).as("postExperience");
cy.getByTestId("save-btn").click();
cy.wait("@postExperience").then((interception) => {
const { body } = interception.request;
expect(body).to.eql({
allow_language_selection: false,
component: "banner_and_modal",
disabled: true,
name: "Test experience name",
privacy_notice_ids: ["pri_b1244715-2adb-499f-abb2-e86b6c0040c2"],
regions: ["fr"],
translations: [
{
accept_button_label: "Accept",
acknowledge_button_label: "OK",
description: "Description",
is_default: true,
language: "en",
privacy_preferences_link_label: "Privacy Preferences",
reject_button_label: "Reject",
save_button_label: "Save",
title: "Title",
},
],
});
});
cy.url().should("match", /privacy-experience$/);
cy.getByTestId("toast-success-msg").should("exist");
});

it("doesn't allow component type to be changed after selection", () => {
cy.selectOption("input-component", "Banner and modal");
cy.getByTestId("input-component").find("input").should("be.disabled");
});

it("doesn't show a preview for a privacy center", () => {
cy.selectOption("input-component", "Privacy center");
cy.getByTestId("no-preview-notice").contains(
"Privacy center preview not available"
);
});

it("doesn't show preview until privacy notice is added", () => {
cy.selectOption("input-component", "Banner and modal");
cy.getByTestId("no-preview-notice").contains(
"No privacy notices added"
);
cy.getByTestId("add-privacy-notice").click();
cy.getByTestId("select-privacy-notice").click();
cy.get(".select-privacy-notice__menu")
.find(".select-privacy-notice__option")
.first()
.click();
cy.getByTestId("no-preview-notice").should("not.exist");
cy.get("#preview-container").should("be.visible");
});

it("allows editing experience text and shows updated text in the preview", () => {
cy.selectOption("input-component", "Banner and modal");
cy.getByTestId("add-privacy-notice").click();
cy.getByTestId("select-privacy-notice").click();
cy.get(".select-privacy-notice__menu")
.find(".select-privacy-notice__option")
.first()
.click();
cy.getByTestId("edit-experience-btn").click();
cy.getByTestId("input-translations.0.title")
.clear()
.type("Edited title");
cy.getByTestId("save-btn").click();
cy.get("#preview-container")
.find("#fides-banner")
.contains("Edited title");
});
});
/**
* Helper function to swap out the component type in a stubbed experience
* @example stubExperience({component: "overlay"})
*/
const stubExperience = () => {
cy.intercept("GET", "/api/v1/experience-config/pri*", {
fixture: "privacy-experiences/experienceConfig.json",
});
};

it.skip("can populate an experience config form with existing values", () => {
stubExperience();
cy.visit(`${PRIVACY_EXPERIENCE_ROUTE}/${EXPERIENCE_ID}`);
cy.getByTestId("input-name").should("have.value", "notice enabled test");

describe("editing an existing experience config", () => {
beforeEach(() => {
stubPrivacyNoticesCrud();
cy.visit(`${PRIVACY_EXPERIENCE_ROUTE}/pri_001`);
});

it("populates the form and shows the preview with the existing values", () => {
cy.wait("@getExperienceDetail");
cy.getByTestId("input-component").find("input").should("be.disabled");
cy.getByTestId("input-name").should(
"have.value",
"Example modal experience"
);
cy.get("#preview-container").contains(
"Manage your consent preferences"
);
});

it("doesn't show a preview while editing TCF experience", () => {
cy.fixture("privacy-experiences/experienceConfig.json").then((data) => {
cy.intercept("GET", "/api/v1/experience-config/pri*", {
...data,
component: "tcf_overlay",
}).as("getTCFExperience");
});
cy.wait("@getTCFExperience");
cy.getByTestId("no-preview-notice").contains(
"TCF preview not available"
);
});
});

it.skip("can submit an experience config form", () => {
stubExperience();
cy.visit(`${PRIVACY_EXPERIENCE_ROUTE}/${EXPERIENCE_ID}`);
cy.getByTestId("save-btn").should("be.disabled");
cy.getByTestId("input-name").clear().type("New experience title");
cy.getByTestId("save-btn").click();
cy.wait("@patchExperience").then((interception) => {
const { body } = interception.request;
expect(body.name).to.eql("New experience title");
// Make sure regions is still ["us_ca"] (unchanged)
expect(body.regions).to.eql(["us_ca"]);
describe("editing translations", () => {
beforeEach(() => {
stubTranslationConfig(true);
cy.visit(`${PRIVACY_EXPERIENCE_ROUTE}/pri_001`);
cy.wait("@getExperienceDetail");
});

it("shows the preview for the translation currently being edited", () => {
cy.getByTestId("language-row-fr").click();
cy.get("#preview-container").contains(
"Gestion du consentement et des préférences"
);
});

it("allows discarding unsaved changes after showing a modal", () => {
cy.getByTestId("language-row-en").click();
cy.getByTestId("input-translations.0.title")
.clear()
.type("Some other title");
cy.getByTestId("cancel-btn").click();
cy.getByTestId("warning-modal-confirm-btn").click();
cy.get("#preview-container").contains(
"Manage your consent preferences"
);
});

it("allows changing the default language after showing a modal", () => {
cy.getByTestId("language-row-fr").click();
cy.getByTestId("input-translations.1.is_default").click();
cy.getByTestId("save-btn").click();
cy.getByTestId("warning-modal-confirm-btn").click();
cy.getByTestId("language-row-fr").contains("(Default)");
cy.get("#preview-container").contains(
"Gestion du consentement et des préférences"
);
});
});
});
Expand Down
8 changes: 4 additions & 4 deletions clients/admin-ui/cypress/e2e/privacy-notices.cy.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ import {
import { PRIVACY_NOTICES_ROUTE } from "~/features/common/nav/v2/routes";
import { RoleRegistryEnum } from "~/types/api";

const ESSENTIAL_NOTICE_ID = "pri_a92477b0-5157-4608-acdc-39283a442f29";
const ESSENTIAL_NOTICE_ID = "pri_a518b4d0-9cbc-48b1-94dc-2fe911537b8e";

describe("Privacy notices", () => {
beforeEach(() => {
Expand Down Expand Up @@ -92,8 +92,8 @@ describe("Privacy notices", () => {
"Essential",
"Functional",
"Analytics",
"Advertising",
"Data Sales",
"Marketing",
"Data Sales and Sharing",
].forEach((name) => {
cy.get("table").contains("tr", name);
});
Expand Down Expand Up @@ -187,7 +187,7 @@ describe("Privacy notices", () => {
});
// Disabled and has no applicable systems
cy.get("table")
.contains("tr", "Advertising")
.contains("tr", "Marketing")
.within(() => {
cy.getByTestId("status-badge").contains("inactive");
});
Expand Down
87 changes: 68 additions & 19 deletions clients/admin-ui/cypress/fixtures/privacy-experiences/experienceConfig.json
View file
Original file line number Diff line number Diff line change
@@ -1,29 +1,78 @@
{
"name": "Experience title",
"disabled": false,
"dismissable": false,
"name": "Example modal experience",
"disabled": true,
"dismissable": true,
"allow_language_selection": false,
"regions": ["us_ca"],
"id": "pri_0338d055-f91b-4a17-ad4e-600c61551199",
"created_at": "2023-05-30T23:42:10.300484+00:00",
"updated_at": "2023-05-31T00:28:24.694384+00:00",
"origin": "???",
"auto_detect_language": true,
"regions": ["us_ca", "us_co", "us_ct", "us_ut", "us_va"],
"id": "pri_001",
"created_at": "2024-03-22T20:06:27.119285+00:00",
"updated_at": "2024-03-22T20:06:27.119285+00:00",
"component": "modal",
"privacy_notices": [],
"privacy_notices": [
{
"name": "Example Notice",
"notice_key": "example_notice",
"internal_description": "An example of a marketing.advertising notice",
"consent_mechanism": "opt_out",
"data_uses": [
"marketing.advertising.first_party.targeted",
"marketing.advertising.third_party.targeted"
],
"enforcement_level": "frontend",
"disabled": true,
"has_gpc_flag": true,
"framework": null,
"default_preference": "opt_in",
"id": "pri_002",
"origin": "pri_309d287c-b208-4fd1-93b2-7b2ff13eddat",
"created_at": "2024-03-22T20:06:26.928879+00:00",
"updated_at": "2024-03-22T20:06:26.928879+00:00",
"cookies": [],
"systems_applicable": false,
"translations": [
{
"language": "en",
"title": "Example Notice",
"description": "We may transfer or share your personal information to third parties in exchange for monetary or other valuable consideration or for the purposes of cross-contextual targeted advertising. You can learn more about what information is used for this purpose in our privacy notice.",
"privacy_notice_history_id": "pri_81b6eda8-c460-4f5b-9b19-e85ee5a7059e"
}
],
"gpp_field_mapping": null
}
],
"translations": [
{
"language": "en",
"is_default": true,
"title": "Translation title",
"accept_button_label": "Accept",
"reject_button_label": "Reject",
"accept_button_label": "Opt in to all",
"acknowledge_button_label": "OK",
"banner_title": null,
"is_default": true,
"privacy_policy_link_label": "Privacy Policy",
"privacy_policy_url": null,
"privacy_preferences_link_label": "Manage preferences",
"reject_button_label": "Opt out of all",
"save_button_label": "Save",
"description": "Translation description",
"privacy_policy_link_label": "Privacy policy",
"privacy_policy_url": "http://ethyca.com",
"privacy_preferences_link_label": "Privacy preferences",
"experience_config_history_id": "pri_50a8563a-c3fe-4861-9320-9c0f014276a0"
"title": "Manage your consent preferences",
"banner_description": null,
"description": "We use cookies and similar methods to recognize visitors and remember their preferences. We may also use them to measure ad campaign effectiveness, target ads, and analyze site traffic. Depending on your location, you may opt-in or opt out of the use of these technologies.",
"privacy_experience_config_history_id": "pri_4aab49f4-8dfd-4f4b-a004-feda16971e2c"
},
{
"language": "fr",
"accept_button_label": "Accepter tout",
"acknowledge_button_label": "OK",
"banner_title": null,
"is_default": false,
"privacy_policy_link_label": "Politique de confidentialité",
"privacy_policy_url": null,
"privacy_preferences_link_label": "Gérer les préférences",
"reject_button_label": "Refuser tous",
"save_button_label": "Enregistrer",
"title": "Gestion du consentement et des préférences",
"banner_description": null,
"description": "Nous utilisons des cookies et des méthodes similaires pour reconnaître les visiteurs de ce site et nous souvenir de leurs préférences. Nous pouvons également les utiliser pour mesurer l’efficacité d’une campagne publicitaire, proposer des publicités ciblées et analyser le trafic du site. En fonction de votre emplacement géographique, vous pouvez choisir d’accepter ou de refuser l’utilisation de ces technologies."
}
]
],
"properties": []
}
Loading

0 comments on commit 0abceb3

Please sign in to comment.