diff --git a/.github/workflows/playwright.yml b/.github/workflows/playwright.yml index a214e3f5..6f878150 100644 --- a/.github/workflows/playwright.yml +++ b/.github/workflows/playwright.yml @@ -32,6 +32,12 @@ jobs: - name: Build dashboard run: yarn build:dashboard + env: + VITE_GOOGLE_CLIENT_ID: ${{ secrets.VITE_GOOGLE_CLIENT_ID }} + VITE_SERVER_BASE_URL: ${{ secrets.VITE_SERVER_BASE_URL }} + VITE_LINK_SURVEY_HOST: ${{ secrets.VITE_LINK_SURVEY_HOST }} + VITE_PUBLIC_POSTHOG_KEY: ${{ secrets.VITE_PUBLIC_POSTHOG_KEY }} + VITE_PUBLIC_POSTHOG_HOST: ${{ secrets.VITE_PUBLIC_POSTHOG_HOST }} - name: Start Backend Server run: docker compose -f ./docker-compose-test.yml up -d diff --git a/apps/frontend/.gitignore b/apps/frontend/.gitignore index b88c8135..2f878a4e 100644 --- a/apps/frontend/.gitignore +++ b/apps/frontend/.gitignore @@ -26,3 +26,4 @@ dist-ssr /playwright-report/ /blob-report/ /playwright/.cache/ +/playwright/.auth/ diff --git a/apps/frontend/package.json b/apps/frontend/package.json index 93317f01..5e312657 100644 --- a/apps/frontend/package.json +++ b/apps/frontend/package.json @@ -60,6 +60,7 @@ "zustand": "^4.4.5" }, "devDependencies": { + "@faker-js/faker": "^9.0.1", "@graphql-codegen/cli": "^3.3.1", "@graphql-codegen/client-preset": "^4.1.0", "@graphql-codegen/typescript": "^3.0.4", diff --git a/apps/frontend/playwright.config.ts b/apps/frontend/playwright.config.ts index 55c996b3..6a4663f4 100644 --- a/apps/frontend/playwright.config.ts +++ b/apps/frontend/playwright.config.ts @@ -1,4 +1,5 @@ import { defineConfig, devices } from "@playwright/test"; +import { ONBOARDED_USER_FILE } from "./tests/utils/constants"; /** * Read environment variables from file. @@ -12,14 +13,14 @@ import { defineConfig, devices } from "@playwright/test"; */ export default defineConfig({ testDir: "./tests", + timeout: 90000, /* Run tests in files in parallel */ fullyParallel: true, /* Fail the build on CI if you accidentally left test.only in the source code. */ forbidOnly: !!process.env.CI, - /* Retry on CI only */ - retries: process.env.CI ? 2 : 0, + retries: 3, /* Opt out of parallel tests on CI. */ - workers: process.env.CI ? 1 : undefined, + workers: process.env.CI ? undefined : "80%", /* Reporter to use. See https://playwright.dev/docs/test-reporters */ reporter: "html", /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */ @@ -33,19 +34,24 @@ export default defineConfig({ /* Configure projects for major browsers */ projects: [ + { name: "setup", testMatch: /.*\.setup\.ts/ }, + { name: "chromium", - use: { ...devices["Desktop Chrome"] }, + use: { ...devices["Desktop Chrome"], storageState: ONBOARDED_USER_FILE }, + dependencies: ["setup"], }, { name: "firefox", - use: { ...devices["Desktop Firefox"] }, + use: { ...devices["Desktop Firefox"], storageState: ONBOARDED_USER_FILE }, + dependencies: ["setup"], }, { name: "webkit", - use: { ...devices["Desktop Safari"] }, + use: { ...devices["Desktop Safari"], storageState: ONBOARDED_USER_FILE }, + dependencies: ["setup"], }, /* Test against mobile viewports. */ diff --git a/apps/frontend/src/layout/AuthLayout.tsx b/apps/frontend/src/layout/AuthLayout.tsx index e7ebd192..f54e23aa 100644 --- a/apps/frontend/src/layout/AuthLayout.tsx +++ b/apps/frontend/src/layout/AuthLayout.tsx @@ -6,7 +6,7 @@ import Profile2 from "../assets/images/loginScreen/profile-2.png"; import Profile3 from "../assets/images/loginScreen/profile-3.png"; import Logo from "../assets/images/logo.png"; -const clientId = import.meta.env.VITE_GOOGLE_CLIENT_ID; +const clientId = import.meta.env.VITE_GOOGLE_CLIENT_ID ?? ""; export function AuthLayout() { return ( diff --git a/apps/frontend/src/layout/partials/Navbar.tsx b/apps/frontend/src/layout/partials/Navbar.tsx index 20ee6bea..a92084b7 100644 --- a/apps/frontend/src/layout/partials/Navbar.tsx +++ b/apps/frontend/src/layout/partials/Navbar.tsx @@ -165,6 +165,7 @@ export const Navbar = () => {
@@ -252,6 +253,7 @@ export const SurveyList = () => { getSurveyNameOnSelect(survey?.id ?? "", event) } className="flex gap-[6px] rounded-md py-[7px] text-sm font-normal text-intg-text-4 transition-all duration-300 ease-in hover:cursor-pointer hover:bg-intg-bg-1 hover:pl-[8px]" + data-testid="delete-survey" > Delete @@ -265,6 +267,7 @@ export const SurveyList = () => { className="w-[500px]" >
diff --git a/apps/frontend/src/modules/surveys/components/studio/create/editor-panel/questions/QuestionPanel.tsx b/apps/frontend/src/modules/surveys/components/studio/create/editor-panel/questions/QuestionPanel.tsx index 7035b5fd..9bf27196 100644 --- a/apps/frontend/src/modules/surveys/components/studio/create/editor-panel/questions/QuestionPanel.tsx +++ b/apps/frontend/src/modules/surveys/components/studio/create/editor-panel/questions/QuestionPanel.tsx @@ -64,11 +64,12 @@ export const QuestionPanel = ({ questionIndex }: Props) => {
- {survey?.status !== SurveyStatusEnum.Active ? ( - deleteQuestion(question)} className="cursor-pointer" size={20} /> - ) : null} - - +
diff --git a/apps/frontend/src/modules/surveys/components/studio/create/editor-panel/questions/attributes/Buttons/TextButton.tsx b/apps/frontend/src/modules/surveys/components/studio/create/editor-panel/questions/attributes/Buttons/TextButton.tsx index c3f67f69..cfbae4de 100644 --- a/apps/frontend/src/modules/surveys/components/studio/create/editor-panel/questions/attributes/Buttons/TextButton.tsx +++ b/apps/frontend/src/modules/surveys/components/studio/create/editor-panel/questions/attributes/Buttons/TextButton.tsx @@ -5,9 +5,10 @@ type Props = { onclick?: () => void; classname?: string; size?: "sm" | "md"; + dataTestid?: string; }; -const TextButton = ({ text, onclick, classname, size = "sm" }: Props) => { +const TextButton = ({ text, onclick, classname, size = "sm", dataTestid }: Props) => { return (
{ size === "md" ? "text-sm" : "text-xs" } w-fit cursor-pointer text-intg-text underline transition-colors delay-75 duration-500 ease-in hover:text-white `, )} + data-testid={dataTestid} > {text}
diff --git a/apps/frontend/src/modules/surveys/components/studio/create/editor-panel/questions/attributes/EditFields/CTAFields.tsx b/apps/frontend/src/modules/surveys/components/studio/create/editor-panel/questions/attributes/EditFields/CTAFields.tsx index c51d4f1b..669ee4da 100644 --- a/apps/frontend/src/modules/surveys/components/studio/create/editor-panel/questions/attributes/EditFields/CTAFields.tsx +++ b/apps/frontend/src/modules/surveys/components/studio/create/editor-panel/questions/attributes/EditFields/CTAFields.tsx @@ -84,6 +84,7 @@ export const CTAFields = () => { classname={`${showDescription ? "hidden" : "block"} mt-2`} text="Add description" onclick={() => setShowDescription(true)} + dataTestid="add-description-btn" /> ) : null} diff --git a/apps/frontend/src/modules/surveys/components/studio/create/editor-panel/questions/attributes/EditFields/FormFieldList.tsx b/apps/frontend/src/modules/surveys/components/studio/create/editor-panel/questions/attributes/EditFields/FormFieldList.tsx index 5ea53f78..00a1d271 100644 --- a/apps/frontend/src/modules/surveys/components/studio/create/editor-panel/questions/attributes/EditFields/FormFieldList.tsx +++ b/apps/frontend/src/modules/surveys/components/studio/create/editor-panel/questions/attributes/EditFields/FormFieldList.tsx @@ -49,6 +49,7 @@ export const FormFieldList = () => { options: newOptions, }); }} + dataTestid="form-type-indicator" /> { true, ); }} + dataTestid="form-label" /> @@ -99,6 +101,7 @@ export const FormFieldList = () => { {survey?.status !== SurveyStatusEnum.Active ? ( { const highestOrderNumber = getHighestOrderNumber(question?.options); const newOptions = [...question.options]; diff --git a/apps/frontend/src/modules/surveys/components/studio/create/editor-panel/questions/attributes/EditFields/RatingFields.tsx b/apps/frontend/src/modules/surveys/components/studio/create/editor-panel/questions/attributes/EditFields/RatingFields.tsx index ddbf3292..1157bd0d 100644 --- a/apps/frontend/src/modules/surveys/components/studio/create/editor-panel/questions/attributes/EditFields/RatingFields.tsx +++ b/apps/frontend/src/modules/surveys/components/studio/create/editor-panel/questions/attributes/EditFields/RatingFields.tsx @@ -54,6 +54,7 @@ export const RatingFields = () => {
option.value === question?.type)} diff --git a/apps/frontend/src/modules/surveys/components/studio/create/editor-panel/questions/attributes/LogicFields/DefaultLogicBox.tsx b/apps/frontend/src/modules/surveys/components/studio/create/editor-panel/questions/attributes/LogicFields/DefaultLogicBox.tsx index 85f533bf..51cbced8 100644 --- a/apps/frontend/src/modules/surveys/components/studio/create/editor-panel/questions/attributes/LogicFields/DefaultLogicBox.tsx +++ b/apps/frontend/src/modules/surveys/components/studio/create/editor-panel/questions/attributes/LogicFields/DefaultLogicBox.tsx @@ -132,6 +132,7 @@ export const DefaultLogicBox: React.FC = ({ value={conditionOptions((question as ParsedQuestion).type!)?.find( (option: Option) => option.value === (logicValues.condition as string), )} + dataTestid="condition-indicator" />
@@ -174,6 +175,7 @@ export const DefaultLogicBox: React.FC = ({ onOperatorChange={() => { handleOperatorChange(); }} + dataTestid="value-indicator" comboBox={true} options={logicValuesOptions(question!)} onchange={handleValuesSelection} @@ -204,6 +206,7 @@ export const DefaultLogicBox: React.FC = ({ diff --git a/apps/frontend/src/modules/surveys/components/studio/create/editor-panel/questions/attributes/LogicFields/Form/DefaultFormLogic.tsx b/apps/frontend/src/modules/surveys/components/studio/create/editor-panel/questions/attributes/LogicFields/Form/DefaultFormLogic.tsx index d5790f9a..0f2dda4a 100644 --- a/apps/frontend/src/modules/surveys/components/studio/create/editor-panel/questions/attributes/LogicFields/Form/DefaultFormLogic.tsx +++ b/apps/frontend/src/modules/surveys/components/studio/create/editor-panel/questions/attributes/LogicFields/Form/DefaultFormLogic.tsx @@ -1,6 +1,6 @@ import { useQuestion } from "@/modules/surveys/hooks/useQuestion"; import { useSurvey } from "@/modules/surveys/hooks/useSurvey"; -import { QuestionLogic, LogicOperator } from "@/types"; +import { LogicOperator, QuestionLogic } from "@/types"; import { cn, generateUniqueId } from "@/utils"; import { destinationOptions } from "@/utils/question"; import { PlusIcon } from "lucide-react"; @@ -131,6 +131,7 @@ const FormLogicDefault = ({ setFormLogicValues, formLogicValues, setIsCreatingLo onchange={(value: SingleValue