Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add new Cypress tests for experience config form #4747

Merged
merged 7 commits into from
Mar 27, 2024
Merged

Add new Cypress tests for experience config form #4747

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
44b974b
add new Cypress tests for experience config form
jpople Mar 27, 2024
72062e5
fix build failure
jpople Mar 27, 2024
2ef1c23
update privacy notice list fixture for compatibility with existing tests
jpople Mar 27, 2024
054c179
disable example privacy notice
jpople Mar 27, 2024
314887a
Merge branch 'main' into jpople/prod-1800/experience-config-form-tests
jpople Mar 27, 2024
d7112d9
Merge branch 'main' into jpople/prod-1800/experience-config-form-tests
jpople Mar 27, 2024
e87a54f
Merge branch 'main' into jpople/prod-1800/experience-config-form-tests
jpople Mar 27, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
9 changes: 2 additions & 7 deletions clients/admin-ui/cypress/e2e/locations-regulations.cy.ts
View file
Open in desktop
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
Open in desktop
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
Open in desktop
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
Open in desktop
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
Loading