Merge branch 'master' into ndskip-for-translating

Dockerfile

@@ -15,7 +15,7 @@ WORKDIR $APP_PATH
 RUN yarn install --immutable
 
 # Copy necessary source files for server and client build
-COPY babel.config.cjs tsconfig.json vite.config.ts postcss.config.cjs index.html $APP_PATH/
+COPY tsconfig.json vite.config.ts postcss.config.cjs panda.config.ts index.html $APP_PATH/
 COPY scripts $APP_PATH/scripts
 
 COPY src $APP_PATH/src

e2e/apiMock.ts

@@ -15,7 +15,6 @@ import {
   getNoteUsersMock,
   responsiblesMock,
   userDataMock,
-  zendeskMock,
 } from "./mockResponses";
 
 const mockDir = "e2e/apiMocks/";
@@ -101,10 +100,6 @@ export const test = Ptest.extend<ExtendParams>({
 });
 
 const urlsToReplace = [
-  {
-    url: "get_zendesk_token",
-    value: zendeskMock,
-  },
   {
     url: "get_responsibles",
     value: responsiblesMock,

e2e/mockResponses/index.ts

@@ -5,7 +5,6 @@
  * LICENSE file in the root directory of this source tree.
  *
  */
-export const zendeskMock = { token: "test_token" };
 
 export const brightcoveTokenMock = {
   access_token: "test",

e2e/specs/blockpicker_frontpage.spec.ts

@@ -9,6 +9,8 @@
 import { expect } from "@playwright/test";
 import { test } from "../apiMock";
 
+test.slow();
+
 test.beforeEach(async ({ page }) => {
   await page.goto("/subject-matter/frontpage-article/new");
   const el = page.getByTestId("slate-editor");
@@ -25,7 +27,7 @@ test("adds and removes grid", async ({ page }) => {
   await page.getByTestId("slate-block-picker").click();
   await expect(page.getByTestId("create-keyFigure")).toBeVisible();
   await expect(page.getByTestId("create-image")).toBeVisible();
-  await expect(page.getByTestId("create-blogPost")).toBeVisible();
+  await expect(page.getByTestId("create-pitch")).toBeVisible();
   await expect(page.getByTestId("slate-block-picker-menu").getByRole("button")).toHaveCount(6);
   await expect(page.getByTestId("remove-grid")).toBeVisible();
   await page.getByTestId("remove-grid").click();
@@ -34,63 +36,68 @@ test("adds and removes grid", async ({ page }) => {
 
 test("adds and removes keyfigure", async ({ page }) => {
   await page.getByTestId("create-keyFigure").click();
-  await expect(page.getByRole("button", { name: "Lagre", exact: true })).toBeDisabled();
-  const modal = page.locator('div[role="dialog"]');
-  await modal.locator("div[name='title']").fill("test");
-  await modal.locator("div[name='subtitle']").fill("test");
-  await page.getByTestId("select-image-from-list").first().click();
-  await page.getByTestId("use-image").click();
-  await expect(page.getByRole("button", { name: "Lagre", exact: true })).toBeEnabled();
-  await page.getByRole("button", { name: "Lagre", exact: true }).click();
+  const dialog = page.getByRole("dialog");
+  await expect(dialog.getByRole("button", { name: "Lagre", exact: true })).toBeDisabled();
+  await dialog.locator("div[name='title']").fill("test");
+  await dialog.locator("div[name='subtitle']").fill("test");
+  await dialog.getByTestId("select-image-from-list").first().dispatchEvent("click");
+  await dialog.getByTestId("use-image").dispatchEvent("click");
+  await expect(dialog.getByRole("button", { name: "Lagre", exact: true })).toBeEnabled();
+  await dialog.getByRole("button", { name: "Lagre", exact: true }).dispatchEvent("click");
   await expect(page.getByTestId("slate-key-figure")).toBeVisible();
   await page.getByTestId("remove-key-figure").click();
   await expect(page.getByTestId("slate-key-figure")).toHaveCount(0);
 });
 
-test("adds and removes blogpost", async ({ page }) => {
-  await page.getByTestId("create-blogPost").click();
-  await expect(page.getByRole("button", { name: "Lagre", exact: true })).toBeDisabled();
-  const modal = page.locator('div[role="dialog"]');
-  await modal.locator("div[name='title']").fill("test");
-  await page.locator("input[name='author']").fill("test");
-  await page.locator("input[name='link']").fill("https://test.test");
-  await page.getByTestId("select-image-from-list").first().click();
-  await page.getByTestId("use-image").click();
-  await expect(page.getByRole("button", { name: "Lagre", exact: true })).toBeEnabled();
-  await page.getByRole("button", { name: "Lagre", exact: true }).click();
-  await expect(page.getByTestId("slate-blog-post")).toBeVisible();
-  await page.getByTestId("remove-blogpost").click();
-  await expect(page.getByTestId("slate-blog-post")).toHaveCount(0);
+test("adds and removes pitch", async ({ page }) => {
+  await page.getByTestId("create-grid").click();
+  await expect(page.getByTestId("slate-grid-cell")).toHaveCount(2);
+  await page.getByTestId("slate-grid-cell").first().click();
+  await page.getByTestId("slate-block-picker").click();
+  await page.getByTestId("create-pitch").click();
+  const dialog = page.getByRole("dialog");
+  await expect(dialog.getByRole("button", { name: "Lagre", exact: true })).toBeDisabled();
+  await dialog.locator("div[name='title']").fill("test");
+  await dialog.locator("div[name='description']").fill("test");
+  await dialog.locator("input[name='link']").fill("https://test.test");
+  await dialog.getByTestId("select-image-from-list").first().dispatchEvent("click");
+  await dialog.getByTestId("use-image").dispatchEvent("click");
+  await expect(dialog.getByRole("button", { name: "Lagre", exact: true })).toBeEnabled();
+  await dialog.getByRole("button", { name: "Lagre", exact: true }).dispatchEvent("click");
+  await expect(page.getByTestId("slate-pitch")).toBeVisible();
+  await page.getByTestId("remove-pitch").click();
+  await expect(page.getByTestId("slate-pitch")).toHaveCount(0);
 });
 
 test("adds and removes contactblock", async ({ page }) => {
   await page.getByTestId("create-contactBlock").click();
-  await expect(page.getByRole("button", { name: "Lagre", exact: true })).toBeDisabled();
-  await page.locator("input[name='name']").fill("test");
-  await page.locator("input[name='jobTitle']").fill("test");
-  await page.locator("input[name='email']").fill("[email protected]");
-  await page.locator("textarea[name='description']").fill("email");
-  await page.getByTestId("select-image-from-list").first().click();
-  await page.getByTestId("use-image").click();
-  await expect(page.getByRole("button", { name: "Lagre", exact: true })).toBeEnabled();
-  await page.getByRole("button", { name: "Lagre", exact: true }).click();
+  const dialog = page.getByRole("dialog");
+  await expect(dialog.getByRole("button", { name: "Lagre", exact: true })).toBeDisabled();
+  await dialog.locator("input[name='name']").fill("test");
+  await dialog.locator("input[name='jobTitle']").fill("test");
+  await dialog.locator("input[name='email']").fill("[email protected]");
+  await dialog.locator("textarea[name='description']").fill("email");
+  await dialog.getByTestId("select-image-from-list").first().dispatchEvent("click");
+  await dialog.getByTestId("use-image").dispatchEvent("click");
+  await expect(dialog.getByRole("button", { name: "Lagre", exact: true })).toBeEnabled();
+  await dialog.getByRole("button", { name: "Lagre", exact: true }).dispatchEvent("click");
   await expect(page.getByTestId("slate-contact-block")).toBeVisible();
   await page.getByTestId("remove-contact-block").click();
   await expect(page.getByTestId("slate-contact-block")).toHaveCount(0);
 });
 
 test("adds and removes campaignblock", async ({ page }) => {
   await page.getByTestId("create-campaignBlock").click();
-  await expect(page.getByRole("button", { name: "Lagre", exact: true })).toBeDisabled();
-  const modal = page.locator('div[role="dialog"]');
-  await modal.locator("div[name='title']").fill("test");
-  await modal.locator("div[name='description']").fill("test");
-  await page.locator("input[name='link']").fill("https://test.test");
-  await modal.locator("div[name='linkText']").fill("Test page");
-  await page.getByTestId("select-image-from-list").first().click();
-  await page.getByTestId("use-image").click();
-  await expect(page.getByRole("button", { name: "Lagre", exact: true })).toBeEnabled();
-  await page.getByRole("button", { name: "Lagre", exact: true }).click();
+  const dialog = page.getByRole("dialog");
+  await expect(dialog.getByRole("button", { name: "Lagre", exact: true })).toBeDisabled();
+  await dialog.locator("div[name='title']").fill("test");
+  await dialog.locator("div[name='description']").fill("test");
+  await dialog.locator("input[name='link']").fill("https://test.test");
+  await dialog.locator("div[name='linkText']").fill("Test page");
+  await dialog.getByTestId("select-image-from-list").first().dispatchEvent("click");
+  await dialog.getByTestId("use-image").dispatchEvent("click");
+  await expect(dialog.getByRole("button", { name: "Lagre", exact: true })).toBeEnabled();
+  await dialog.getByRole("button", { name: "Lagre", exact: true }).dispatchEvent("click");
   await expect(page.getByTestId("slate-campaign-block")).toBeVisible();
   await page.getByTestId("remove-campaign-block").click();
   await expect(page.getByTestId("slate-campaign-block")).toHaveCount(0);

e2e/specs/blockpicker_learning_resource.spec.ts

@@ -57,12 +57,13 @@ test("adds and removes grid", async ({ page }) => {
 
 test("adds and removes code-block", async ({ page }) => {
   await page.getByTestId("create-code").click();
-  await expect(page.getByTestId("modal-header")).toBeVisible();
-  const modalBody = page.getByTestId("modal-body");
-  await modalBody.locator("input").first().fill("Tittel");
-  await modalBody.locator("select").selectOption("HTML");
-  await modalBody.locator("textarea").first().fill("Some <strong>markup</strong>{enter}Newline");
-  await page.getByRole("button").getByText("Lagre").click();
+  const dialog = page.getByRole("dialog");
+  await expect(dialog).toBeVisible();
+  await dialog.getByLabel("Tittel").fill("Tittel");
+  await dialog.getByRole("combobox", { name: "Velg kodespråk:" }).click();
+  await dialog.getByRole("option", { name: "Markdown" }).click();
+  await dialog.locator("textarea").first().fill("Some <strong>markup</strong>{enter}Newline");
+  await dialog.getByRole("button", { name: "Lagre" }).click();
   await expect(page.getByTestId("remove-code")).toBeVisible();
   await page.getByTestId("remove-code").click();
   await expect(page.getByTestId("remove-code")).toHaveCount(0);
@@ -94,31 +95,30 @@ test("opens and closes video", async ({ page }) => {
 
 test("opens and closes audio", async ({ page }) => {
   await page.getByTestId("create-audio").click();
-  await expect(page.getByTestId("modal-header")).toBeVisible();
   await page.getByRole("button").getByText("Velg lyd").first().click();
-  await expect(page.getByTestId("modal-header")).toHaveCount(0);
   await expect(page.getByTestId("remove-element")).toBeVisible();
   await page.getByTestId("remove-element").click();
   await expect(page.getByTestId("remove-element")).toHaveCount(0);
 });
 
 test("opens and closes file", async ({ page }) => {
   await page.getByTestId("create-file").click();
-  await expect(page.getByTestId("modal-header")).toBeVisible();
-  await page.getByTestId("close-modal-button").click();
-  await expect(page.getByTestId("modal-header")).toHaveCount(0);
+  await expect(page.getByRole("dialog")).toBeVisible();
+  await page.getByRole("dialog").getByRole("button", { name: "Avbryt" }).click();
+  await expect(page.getByRole("dialog")).toHaveCount(0);
 });
 
 test("opens and closes url", async ({ page }) => {
   await page.getByTestId("create-url").click();
-  await expect(page.getByTestId("modal-header")).toBeVisible();
-  await page.getByTestId("close-modal-button").click();
-  await expect(page.getByTestId("modal-header")).toHaveCount(0);
+  const dialog = page.getByRole("dialog");
+  await expect(dialog).toBeVisible();
+  await dialog.getByRole("button").getByText("Avbryt").click();
+  await expect(page.getByRole("dialog")).toHaveCount(0);
 });
 
 test("opens and closes related content", async ({ page }) => {
   await page.getByTestId("create-related").click();
   await expect(page.getByTestId("editRelated")).toBeVisible();
-  await page.getByTestId("close-related-button").click();
-  await expect(page.getByTestId("styled-article-modal")).toHaveCount(0);
+  await page.getByRole("button", { name: "Lukk" }).click();
+  await expect(page.getByRole("dialog")).toHaveCount(0);
 });

e2e/specs/disclaimer.spec.ts

@@ -27,7 +27,7 @@ test("update disclaimer text", async ({ page }) => {
 });
 
 test("add content to disclaimer", async ({ page }) => {
-  await page.getByTestId("slate-disclaimer-content").click();
+  await page.locator("[data-uu-content]").click();
   await page.getByTestId("slate-block-picker").click();
   await page.getByTestId("create-image").click();
   await page.getByTestId("select-image-from-list").first().click();
@@ -36,7 +36,7 @@ test("add content to disclaimer", async ({ page }) => {
 });
 
 test("move content out of disclaimer", async ({ page }) => {
-  await page.getByTestId("slate-disclaimer-content").click();
+  await page.locator("[data-uu-content]").click();
   await page.getByTestId("slate-block-picker").click();
   await page.getByTestId("create-image").click();
   await page.getByTestId("select-image-from-list").first().click();
@@ -48,7 +48,7 @@ test("move content out of disclaimer", async ({ page }) => {
 });
 
 test("delete disclaimer with content", async ({ page }) => {
-  await page.getByTestId("slate-disclaimer-content").click();
+  await page.locator("[data-uu-content]").click();
   await page.getByTestId("slate-block-picker").click();
   await page.getByTestId("create-image").click();
   await page.getByTestId("select-image-from-list").first().click();

e2e/specs/film.spec.ts

@@ -17,8 +17,7 @@ test.beforeEach(async ({ page }) => {
 test("Can add a movie to the slideshow", async ({ page }) => {
   const movie = "Brukerstøtte";
   await page.getByTestId("dropdown-input").first().fill(movie);
-  await page.getByTestId("dropdown-items").getByText(movie).first().click();
-  await page.getByTestId("dropdown-items").blur();
+  await page.getByTestId("dropdown-item").first().click();
   await expect(page.getByTestId("elementListItem").filter({ hasText: movie }).first()).toBeVisible();
 });
 
@@ -31,18 +30,18 @@ test("Can remove movie from list", async ({ page }) => {
 
 test("Can add and remove theme", async ({ page }) => {
   await page.getByTestId("add-theme-modal").click();
-  await page.keyboard.type("Ny testgruppe");
+  await page.getByLabel("Bokmål").fill("Ny testgruppe");
   await page.getByRole("button", { name: "Opprett gruppe" }).click();
   await expect(page.getByRole("heading", { name: "Ny testgruppe" })).toBeVisible();
 });
 
 test("Can save changes with new data", async ({ page, harCheckpoint }) => {
   await page.getByTestId("add-theme-modal").click();
-  await page.keyboard.type("Testgruppee");
+  await page.getByLabel("Bokmål").fill("Testgruppee");
   await page.getByRole("button", { name: "Opprett gruppe" }).click();
-  await page.getByRole("combobox").getByPlaceholder('Legg til film i "Testgruppee"').fill("Brukerstøtte");
-  await page.getByTestId("dropdown-items").getByText("Brukerstøtte").first().click();
-  await page.getByTestId("dropdown-items").blur();
+  await page.getByPlaceholder('Legg til film i "Testgruppee"').fill("Brukerstøtte");
+  await page.getByTestId("dropdown-item").getByText("Brukerstøtte").first().click();
+  await page.click("body");
 
   await harCheckpoint();
   await page.getByRole("button").getByText("Lagre").click();

e2e/specs/grid.spec.ts

@@ -37,15 +37,16 @@ test("can change background color", async ({ page }) => {
   await page.getByTestId("edit-grid-button").click();
   await page.getByText("Hvit").click();
   await page.getByRole("button", { name: "Lagre", exact: true }).click();
-  await expect(page.locator('div[data-background="white"]')).toBeVisible();
 });
 
 test("can set border", async ({ page }) => {
   await page.getByTestId("edit-grid-button").click();
-  await page.getByRole("checkbox").setChecked(true);
+  let checkbox = page.locator('[data-scope="checkbox"][data-part="root"]');
+  await checkbox.click();
   await page.getByRole("button", { name: "Lagre", exact: true }).click();
   await page.getByTestId("edit-grid-button").click();
-  expect(await page.getByRole("checkbox").isChecked()).toBeTruthy();
+  checkbox = page.locator('[data-scope="checkbox"][data-part="root"][data-state="checked"]');
+  await expect(checkbox).toBeVisible();
 });
 
 test("can enable parallax on cells", async ({ page }) => {

e2e/specs/math.spec.ts

@@ -11,7 +11,6 @@ import { test } from "../apiMock";
 
 const metaKey = process.platform === "darwin" ? "Meta" : "Control";
 
-
 test.beforeEach(async ({ page }) => {
   await page.goto("/subject-matter/learning-resource/new");
 
@@ -23,20 +22,20 @@ test.beforeEach(async ({ page }) => {
 });
 
 test("editor is visible", async ({ page }) => {
-  const mathEditor = page.getByTestId("modal-body").getByRole("application");
+  const mathEditor = page.getByRole("dialog").getByRole("application");
   await mathEditor.waitFor();
   await expect(mathEditor).toBeVisible();
 });
 
 test("contains text from slate editor", async ({ page }) => {
-  const mathEditor = page.getByTestId("modal-body").getByRole("application");
+  const mathEditor = page.getByRole("dialog").getByRole("application");
   await mathEditor.waitFor();
   await mathEditor.locator('[class="wrs_container"]').waitFor();
   expect((await mathEditor.locator('[class="wrs_container"]').textContent())?.slice(1)).toEqual("111+1");
 });
 
 test("can change text and save", async ({ page }) => {
-  const mathEditor = page.getByTestId("modal-body").getByRole("application");
+  const mathEditor = page.getByRole("dialog").getByRole("application");
   await mathEditor.waitFor();
   await mathEditor.locator('[class="wrs_focusElementContainer"]').getByRole("textbox").click();
   await page.keyboard.type("=112");
@@ -45,7 +44,7 @@ test("can change text and save", async ({ page }) => {
 });
 
 test("can change preview when preview button pressed", async ({ page }) => {
-  const mathEditor = page.getByTestId("modal-body").getByRole("application");
+  const mathEditor = page.getByRole("dialog").getByRole("application");
   await mathEditor.waitFor();
   expect(await page.getByTestId("preview-math-text").textContent()).toEqual("111+1");
   await mathEditor.locator('[class="wrs_focusElementContainer"]').getByRole("textbox").click();
@@ -55,10 +54,10 @@ test("can change preview when preview button pressed", async ({ page }) => {
 });
 
 test("can provide modal when leaving unchecked edits", async ({ page }) => {
-  const mathEditor = page.getByTestId("modal-body").getByRole("application");
+  const mathEditor = page.getByRole("dialog").getByRole("application");
   await mathEditor.waitFor();
   await mathEditor.locator('[class="wrs_focusElementContainer"]').getByRole("textbox").click();
   await page.keyboard.type("=112");
-  await page.getByTestId("abort-math").click();
-  await expect(page.getByTestId("alert-modal")).toBeVisible();
+  await page.getByRole("button", { name: "Lukk" }).click();
+  await expect(page.getByTestId("alert-dialog")).toBeVisible();
 });