Skip to content

Migrate to more modern toolset (Vite, Vitest, Playwright) + Upgrade dependencies + More Improvements #172

Migrate to more modern toolset (Vite, Vitest, Playwright) + Upgrade dependencies + More Improvements

Migrate to more modern toolset (Vite, Vitest, Playwright) + Upgrade dependencies + More Improvements #172

Triggered via pull request May 3, 2024 19:57
@alan2207alan2207
synchronize #152
dev
Status Failure
Total duration 1m 45s
Artifacts 1

ci.yml

on: pull_request
Fit to window
Zoom out
Zoom in

Annotations

10 errors
src/lib/__tests__/authorization.test.tsx > should view protected resource if user role is matching: src/lib/__tests__/authorization.test.tsx#L16
TestingLibraryElementError: Unable to find an element with the text: This is very confidential data. This could be because the text is broken up by multiple elements. In this case, you can provide a function for your text matcher to make your matcher more flexible. Ignored nodes: comments, script, style <body> <div> <div class="flex h-screen w-screen flex-col items-center justify-center text-red-500" role="alert" > <h2 class="text-lg font-semibold" > Ooops, something went wrong :( </h2> <button class="flex items-center justify-center rounded-md border border-gray-300 font-medium shadow-sm hover:opacity-80 focus:outline-none disabled:cursor-not-allowed disabled:opacity-70 bg-blue-600 text-white py-2 px-6 text-md mt-4" type="button" > <span class="mx-2" > Refresh </span> </button> </div> </div> </body> ❯ Object.getElementError node_modules/@testing-library/dom/dist/config.js:37:19 ❯ node_modules/@testing-library/dom/dist/query-helpers.js:76:38 ❯ node_modules/@testing-library/dom/dist/query-helpers.js:52:17 ❯ node_modules/@testing-library/dom/dist/query-helpers.js:95:19 ❯ src/lib/__tests__/authorization.test.tsx:16:17
src/lib/__tests__/authorization.test.tsx > should not view protected resource if user role does not match and show fallback message instead: src/lib/__tests__/authorization.test.tsx#L36
TestingLibraryElementError: Unable to find an element with the text: You are unauthorized to view this resource. This could be because the text is broken up by multiple elements. In this case, you can provide a function for your text matcher to make your matcher more flexible. Ignored nodes: comments, script, style <body> <div> <div class="flex h-screen w-screen flex-col items-center justify-center text-red-500" role="alert" > <h2 class="text-lg font-semibold" > Ooops, something went wrong :( </h2> <button class="flex items-center justify-center rounded-md border border-gray-300 font-medium shadow-sm hover:opacity-80 focus:outline-none disabled:cursor-not-allowed disabled:opacity-70 bg-blue-600 text-white py-2 px-6 text-md mt-4" type="button" > <span class="mx-2" > Refresh </span> </button> </div> </div> </body> ❯ Object.getElementError node_modules/@testing-library/dom/dist/config.js:37:19 ❯ node_modules/@testing-library/dom/dist/query-helpers.js:76:38 ❯ node_modules/@testing-library/dom/dist/query-helpers.js:52:17 ❯ node_modules/@testing-library/dom/dist/query-helpers.js:95:19 ❯ src/lib/__tests__/authorization.test.tsx:36:17
src/lib/__tests__/authorization.test.tsx > should view protected resource if policy check passes: src/lib/__tests__/authorization.test.tsx#L48
TestingLibraryElementError: Unable to find an element with the text: This is very confidential data. This could be because the text is broken up by multiple elements. In this case, you can provide a function for your text matcher to make your matcher more flexible. Ignored nodes: comments, script, style <body> <div> <div class="flex h-screen w-screen flex-col items-center justify-center text-red-500" role="alert" > <h2 class="text-lg font-semibold" > Ooops, something went wrong :( </h2> <button class="flex items-center justify-center rounded-md border border-gray-300 font-medium shadow-sm hover:opacity-80 focus:outline-none disabled:cursor-not-allowed disabled:opacity-70 bg-blue-600 text-white py-2 px-6 text-md mt-4" type="button" > <span class="mx-2" > Refresh </span> </button> </div> </div> </body> ❯ Object.getElementError node_modules/@testing-library/dom/dist/config.js:37:19 ❯ node_modules/@testing-library/dom/dist/query-helpers.js:76:38 ❯ node_modules/@testing-library/dom/dist/query-helpers.js:52:17 ❯ node_modules/@testing-library/dom/dist/query-helpers.js:95:19 ❯ src/lib/__tests__/authorization.test.tsx:48:17
src/lib/__tests__/authorization.test.tsx > should not view protected resource if policy check fails and show fallback message instead: src/lib/__tests__/authorization.test.tsx#L68
TestingLibraryElementError: Unable to find an element with the text: You are unauthorized to view this resource. This could be because the text is broken up by multiple elements. In this case, you can provide a function for your text matcher to make your matcher more flexible. Ignored nodes: comments, script, style <body> <div> <div class="flex h-screen w-screen flex-col items-center justify-center text-red-500" role="alert" > <h2 class="text-lg font-semibold" > Ooops, something went wrong :( </h2> <button class="flex items-center justify-center rounded-md border border-gray-300 font-medium shadow-sm hover:opacity-80 focus:outline-none disabled:cursor-not-allowed disabled:opacity-70 bg-blue-600 text-white py-2 px-6 text-md mt-4" type="button" > <span class="mx-2" > Refresh </span> </button> </div> </div> </body> ❯ Object.getElementError node_modules/@testing-library/dom/dist/config.js:37:19 ❯ node_modules/@testing-library/dom/dist/query-helpers.js:76:38 ❯ node_modules/@testing-library/dom/dist/query-helpers.js:52:17 ❯ node_modules/@testing-library/dom/dist/query-helpers.js:95:19 ❯ src/lib/__tests__/authorization.test.tsx:68:17
src/features/discussions/routes/__tests__/Discussion.test.tsx > should render discussion: src/features/discussions/routes/__tests__/Discussion.test.tsx#L34
TestingLibraryElementError: Unable to find an element with the text: Enhanced responsive software. This could be because the text is broken up by multiple elements. In this case, you can provide a function for your text matcher to make your matcher more flexible. Ignored nodes: comments, script, style <body> <div> <div aria-live="assertive" class="pointer-events-none fixed inset-0 z-50 flex flex-col items-end space-y-4 px-4 py-6 sm:items-start sm:p-6" > <div class="flex w-full flex-col items-center space-y-4 sm:items-end" > <div class="pointer-events-auto w-full max-w-sm overflow-hidden rounded-lg bg-white shadow-lg ring-1 ring-black/5" > <div aria-label="Error" class="p-4" role="alert" > <div class="flex items-start" > <div class="shrink-0" > <svg aria-hidden="true" class="size-6 text-red-500" data-slot="icon" fill="currentColor" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" > <path clip-rule="evenodd" d="M8 15A7 7 0 1 0 8 1a7 7 0 0 0 0 14Zm2.78-4.22a.75.75 0 0 1-1.06 0L8 9.06l-1.72 1.72a.75.75 0 1 1-1.06-1.06L6.94 8 5.22 6.28a.75.75 0 0 1 1.06-1.06L8 6.94l1.72-1.72a.75.75 0 1 1 1.06 1.06L9.06 8l1.72 1.72a.75.75 0 0 1 0 1.06Z" fill-rule="evenodd" /> </svg> </div> <div class="ml-3 w-0 flex-1 pt-0.5" > <p class="text-sm font-medium text-gray-900" > Error </p> <p class="mt-1 text-sm text-gray-500" > Error: No authorization token provided! </p> </div> <div class="ml-4 flex shrink-0" > <button class="inline-flex rounded-md bg-white text-gray-400 hover:text-gray-500 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2" > <span class="sr-only" > Close </span> <svg aria-hidden="true" class="size-5" data-slot="icon" fill="currentColor" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" > <path d="M5.28 4.22a.75.75 0 0 0-1.06 1.06L6.94 8l-2.72 2.72a.75.75 0 1 0 1.06 1.06L8 9.06l2.72 2.72a.75.75 0 1 0 1.06-1.06L9.06 8l2.72-2.72a.75.75 0 0 0-1.06-1.06L8 6.94 5.28 4.22Z" /> </svg> </button> </div> </div> </div> </div> </div> </div> </div> </body> Ignored nodes: comments, script, style <body> <div> <div aria-live="assertive" class="pointer-events-none fixed inset-0 z-50 flex flex-col items-end space-y-4 px-4 py-6 sm:items-start sm:p-6" > <div class="flex w-full flex-col items-center space-y-4 sm:items-end" > <div class="pointer-events-auto w-full max-w-sm overflow-hidden rounded-lg bg-white shadow-lg ring-1 ring-black/5" > <div aria-label="Error" class="p-4" role="alert" > <div class="flex items-start" > <div class="shrink-0" > <svg aria-hidden="true" class="size-6 text-red-500" data-slot="icon" fill="currentColor" viewBo
src/features/discussions/routes/__tests__/Discussion.test.tsx > should update discussion: src/features/discussions/routes/__tests__/Discussion.test.tsx#L34
TestingLibraryElementError: Unable to find an element with the text: Reactive neutral moderator. This could be because the text is broken up by multiple elements. In this case, you can provide a function for your text matcher to make your matcher more flexible. Ignored nodes: comments, script, style <body> <div> <div aria-live="assertive" class="pointer-events-none fixed inset-0 z-50 flex flex-col items-end space-y-4 px-4 py-6 sm:items-start sm:p-6" > <div class="flex w-full flex-col items-center space-y-4 sm:items-end" > <div class="pointer-events-auto w-full max-w-sm overflow-hidden rounded-lg bg-white shadow-lg ring-1 ring-black/5" > <div aria-label="Error" class="p-4" role="alert" > <div class="flex items-start" > <div class="shrink-0" > <svg aria-hidden="true" class="size-6 text-red-500" data-slot="icon" fill="currentColor" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" > <path clip-rule="evenodd" d="M8 15A7 7 0 1 0 8 1a7 7 0 0 0 0 14Zm2.78-4.22a.75.75 0 0 1-1.06 0L8 9.06l-1.72 1.72a.75.75 0 1 1-1.06-1.06L6.94 8 5.22 6.28a.75.75 0 0 1 1.06-1.06L8 6.94l1.72-1.72a.75.75 0 1 1 1.06 1.06L9.06 8l1.72 1.72a.75.75 0 0 1 0 1.06Z" fill-rule="evenodd" /> </svg> </div> <div class="ml-3 w-0 flex-1 pt-0.5" > <p class="text-sm font-medium text-gray-900" > Error </p> <p class="mt-1 text-sm text-gray-500" > Error: No authorization token provided! </p> </div> <div class="ml-4 flex shrink-0" > <button class="inline-flex rounded-md bg-white text-gray-400 hover:text-gray-500 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2" > <span class="sr-only" > Close </span> <svg aria-hidden="true" class="size-5" data-slot="icon" fill="currentColor" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" > <path d="M5.28 4.22a.75.75 0 0 0-1.06 1.06L6.94 8l-2.72 2.72a.75.75 0 1 0 1.06 1.06L8 9.06l2.72 2.72a.75.75 0 1 0 1.06-1.06L9.06 8l2.72-2.72a.75.75 0 0 0-1.06-1.06L8 6.94 5.28 4.22Z" /> </svg> </button> </div> </div> </div> </div> </div> </div> </div> </body> Ignored nodes: comments, script, style <body> <div> <div aria-live="assertive" class="pointer-events-none fixed inset-0 z-50 flex flex-col items-end space-y-4 px-4 py-6 sm:items-start sm:p-6" > <div class="flex w-full flex-col items-center space-y-4 sm:items-end" > <div class="pointer-events-auto w-full max-w-sm overflow-hidden rounded-lg bg-white shadow-lg ring-1 ring-black/5" > <div aria-label="Error" class="p-4" role="alert" > <div class="flex items-start" > <div class="shrink-0" > <svg aria-hidden="true" class="size-6 text-red-500" data-slot="icon" fill="currentColor" viewBox=
src/features/discussions/routes/__tests__/Discussion.test.tsx > should create and delete a comment on the discussion: src/features/discussions/routes/__tests__/Discussion.test.tsx#L34
TestingLibraryElementError: Unable to find an element with the text: Face to face 6th generation complexity. This could be because the text is broken up by multiple elements. In this case, you can provide a function for your text matcher to make your matcher more flexible. Ignored nodes: comments, script, style <body> <div> <div aria-live="assertive" class="pointer-events-none fixed inset-0 z-50 flex flex-col items-end space-y-4 px-4 py-6 sm:items-start sm:p-6" > <div class="flex w-full flex-col items-center space-y-4 sm:items-end" > <div class="pointer-events-auto w-full max-w-sm overflow-hidden rounded-lg bg-white shadow-lg ring-1 ring-black/5" > <div aria-label="Error" class="p-4" role="alert" > <div class="flex items-start" > <div class="shrink-0" > <svg aria-hidden="true" class="size-6 text-red-500" data-slot="icon" fill="currentColor" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" > <path clip-rule="evenodd" d="M8 15A7 7 0 1 0 8 1a7 7 0 0 0 0 14Zm2.78-4.22a.75.75 0 0 1-1.06 0L8 9.06l-1.72 1.72a.75.75 0 1 1-1.06-1.06L6.94 8 5.22 6.28a.75.75 0 0 1 1.06-1.06L8 6.94l1.72-1.72a.75.75 0 1 1 1.06 1.06L9.06 8l1.72 1.72a.75.75 0 0 1 0 1.06Z" fill-rule="evenodd" /> </svg> </div> <div class="ml-3 w-0 flex-1 pt-0.5" > <p class="text-sm font-medium text-gray-900" > Error </p> <p class="mt-1 text-sm text-gray-500" > Error: No authorization token provided! </p> </div> <div class="ml-4 flex shrink-0" > <button class="inline-flex rounded-md bg-white text-gray-400 hover:text-gray-500 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2" > <span class="sr-only" > Close </span> <svg aria-hidden="true" class="size-5" data-slot="icon" fill="currentColor" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" > <path d="M5.28 4.22a.75.75 0 0 0-1.06 1.06L6.94 8l-2.72 2.72a.75.75 0 1 0 1.06 1.06L8 9.06l2.72 2.72a.75.75 0 1 0 1.06-1.06L9.06 8l2.72-2.72a.75.75 0 0 0-1.06-1.06L8 6.94 5.28 4.22Z" /> </svg> </button> </div> </div> </div> </div> </div> </div> </div> </body> Ignored nodes: comments, script, style <body> <div> <div aria-live="assertive" class="pointer-events-none fixed inset-0 z-50 flex flex-col items-end space-y-4 px-4 py-6 sm:items-start sm:p-6" > <div class="flex w-full flex-col items-center space-y-4 sm:items-end" > <div class="pointer-events-auto w-full max-w-sm overflow-hidden rounded-lg bg-white shadow-lg ring-1 ring-black/5" > <div aria-label="Error" class="p-4" role="alert" > <div class="flex items-start" > <div class="shrink-0" > <svg aria-hidden="true" class="size-6 text-red-500" data-slot="icon" fill="currentColor"
src/features/discussions/routes/__tests__/Discussions.test.tsx > should create, render and delete discussions: src/features/discussions/routes/__tests__/Discussions.test.tsx#L22
TestingLibraryElementError: Unable to find an element with the text: /no entries/i. This could be because the text is broken up by multiple elements. In this case, you can provide a function for your text matcher to make your matcher more flexible. Ignored nodes: comments, script, style <body> <div> <div class="flex h-screen w-screen flex-col items-center justify-center text-red-500" role="alert" > <h2 class="text-lg font-semibold" > Ooops, something went wrong :( </h2> <button class="flex items-center justify-center rounded-md border border-gray-300 font-medium shadow-sm hover:opacity-80 focus:outline-none disabled:cursor-not-allowed disabled:opacity-70 bg-blue-600 text-white py-2 px-6 text-md mt-4" type="button" > <span class="mx-2" > Refresh </span> </button> </div> </div> </body> Ignored nodes: comments, script, style <body> <div> <div class="flex h-screen w-screen flex-col items-center justify-center text-red-500" role="alert" > <h2 class="text-lg font-semibold" > Ooops, something went wrong :( </h2> <button class="flex items-center justify-center rounded-md border border-gray-300 font-medium shadow-sm hover:opacity-80 focus:outline-none disabled:cursor-not-allowed disabled:opacity-70 bg-blue-600 text-white py-2 px-6 text-md mt-4" type="button" > <span class="mx-2" > Refresh </span> </button> </div> </div> </body> ❯ waitForWrapper node_modules/@testing-library/dom/dist/wait-for.js:163:27 ❯ node_modules/@testing-library/dom/dist/query-helpers.js:86:33 ❯ src/features/discussions/routes/__tests__/Discussions.test.tsx:22:23
all-cli-check
Process completed with exit code 1.
e2e
Process completed with exit code 1.

Artifacts

Produced during runtime
Name Size
playwright-report Expired
742 KB