PLASMA-6367: Cypress configuration upgrade

.github/workflows/cypress-common.yml

@@ -44,7 +44,7 @@ jobs:
           else
             echo "SCOPE={core,new-hope,typo,icons,cy-utils}" >> $GITHUB_ENV
           fi
-      
+
       - name: Install dependencies for check-test-files-exist
         if: ${{ inputs.components }}
         run: |
@@ -84,10 +84,10 @@ jobs:
         run: |
           if [ -n "${{ inputs.components }}" ] && [ "${{ steps.check-test-files-exist.outputs.tests-exist }}" = "true" ]; then
             echo "Running Cypress for specific components: ${{ inputs.components }}"
-            npm run cy:${{ inputs.scope }}:run-ct --components="${{ inputs.components }}"
+            npm run cy:${{ inputs.scope }}:run --components="${{ inputs.components }}"
           elif [ -z "${{ inputs.components }}" ]; then
             echo "Running Cypress for all components"
-            npm run cy:${{ inputs.scope }}:run-ct
+            npm run cy:${{ inputs.scope }}:run
           else
               echo "Skipping Cypress: No test files found for specified components"
           fi

CONTRIBUTING.md

@@ -108,15 +108,15 @@ npm ci && npx lerna bootstrap
 В корне **monorepo** выполните команду (для остальных библиотек команды будут соответствующими):
 
 ```sh
-npm run cy:ui:run-ct
+npm run cy:ui:run
 ```
 
 #### Обновление скриншотов
 
 Если это необходимо, то для этого выполните команду:
 
 ```sh
-npm run cy:ui:run-ct-update-diffs
+npm run cy:ui:run-update
 ```
 
 -   добавьте их в commit;
@@ -126,7 +126,7 @@ npm run cy:ui:run-ct-update-diffs
 Выполните команду:
 
 ```sh
-npm run cy:ui:open-ct
+npm run cy:ui:open
 ```
 
 #### Запуск тестов с указанием компонента(-ов)
@@ -136,13 +136,13 @@ npm run cy:ui:open-ct
 Это поведение можно изменить указав что именно нужно запускать.
 
 ```sh
-npm run cy:ui:run-ct --components='component1, component2'
+npm run cy:ui:run --components='component1, component2'
 ```
 
 или
 
 ```sh
-npm run cy:web:run-ct-update-diffs --components='component1, component2'
+npm run cy:web:run-update --components='component1, component2'
 ```
 
 ## Commit step

actions/platform-test/README.md

@@ -51,7 +51,7 @@ cypress
 Для локального запуска тестов может потребоваться запускать тесты на одной платформе, например на Портале. Для пакета @salutejs/plasma-temple по умолчанию тесты запускаются для платформы `sberbox`
 
 ```sh
-$ TEST_PLATFORM=sberportal npm run cy:temple:open-ct
+$ TEST_PLATFORM=sberportal npm run cy:temple:open
 ```
 
 ### API
@@ -62,5 +62,5 @@ node actions/platform-test/lib/index.js
 # параметры
 --config { path/to/config/dir } # путь до директории конфигов относительно корня репозитория
 --platform { sberbox | sberportal | mobile } # платформа
---command { run-ct | open-ct } # команда тестирования
+--command { run | open } # команда тестирования
 ```

actions/platform-test/src/index.ts

@@ -27,7 +27,7 @@ export async function platfomTest() {
 
         invariant(files, `Cannot read configs files for ${process.env.PACKAGE_NAME}`);
 
-        if (command === 'open-ct') {
+        if (command === 'open') {
             const foundConf = files.find((file) => file.includes(platform));
 
             invariant(foundConf, `Cannot find config for platform ${platform}`);

actions/platform-test/src/spawn.ts

@@ -2,12 +2,12 @@ import { spawn } from 'child_process';
 
 import { log } from './helpers';
 
-export function spawnCyCommand(command: 'run-ct' | 'open-ct', args: ReadonlyArray<string>) {
+export function spawnCyCommand(command: 'run' | 'open', args: ReadonlyArray<string>) {
     log('spawn command', command);
     log('spawn args', args);
 
     return new Promise((resolve, reject) => {
-        const proc = spawn('cypress', [command, '--browser', 'chromium', ...args], {
+        const proc = spawn('cypress', [command, '--component', '--browser', 'chromium', ...args], {
             env: process.env,
             stdio: 'inherit',
             detached: false,

actions/platform-test/src/types.ts

@@ -1,10 +1,10 @@
 type LocalRunTests = {
-    command: 'open-ct';
+    command: 'open';
     platform: 'sberbox' | 'sberportal' | 'mobile';
 };
 
 type DockerRunTests = {
-    command: 'run-ct';
+    command: 'run';
     platform: never;
 };
 

cypress.config.ts

@@ -1,4 +1,4 @@
-import path from 'path';
+import * as path from 'path';
 import { defineConfig } from 'cypress';
 
 import { getWebpackConfig } from './cypress/webpack.config';
@@ -50,6 +50,7 @@ const getTestMatch = () => {
 
 export default defineConfig({
     component: {
+        numTestsKeptInMemory: 5,
         specPattern: getTestMatch(),
         supportFile: supportFilePath,
         devServer: {
@@ -63,7 +64,7 @@ export default defineConfig({
         snapshotsDir,
         package: packageName,
         a11yCheck: false,
-        threshold: 0.005,
+        threshold: 0.005, // это 0.5%
         hasComponents: !!components,
         hasSpecGroup: !!specGroup,
     },
@@ -72,5 +73,7 @@ export default defineConfig({
         openMode: 0,
     },
     video: false,
+    viewportWidth: 500,
+    viewportHeight: 500,
     chromeWebSecurity: false,
 });

cypress/Dockerfile

@@ -0,0 +1,28 @@
+FROM cypress/base:24.11.1
+
+RUN apt-get update && \
+    apt-get install --no-install-recommends -y chromium && \
+    apt-get clean && \
+    rm -rf /var/lib/apt/lists/*
+
+RUN npm install --location=global "cypress@15.9.0" && \
+    cypress verify
+
+RUN apt-get update && apt-get install -y --no-install-recommends \
+    ca-certificates \
+    locales \
+    unzip
+
+ENV PUPPETEER_SKIP_CHROMIUM_DOWNLOAD=true \
+    PUPPETEER_EXECUTABLE_PATH=/usr/bin/chromium \
+    LANG=en_US.UTF-8 \
+    LANGUAGE=en_US:en \
+    CHROMIUM_FLAGS="--no-sandbox --disable-dev-shm-usage --disable-gpu"
+
+RUN ln -sf /usr/bin/chromium /usr/bin/chromium-browser
+
+WORKDIR /e2e
+
+RUN cypress version
+
+CMD ["cypress", "run"]

cypress/plugins/index.ts

@@ -15,22 +15,25 @@ export const setupNodeEvents = (on: Cypress.PluginEvents, config: Cypress.Plugin
 
     coverage(on, config);
 
-    if (process.env.PLATFORM_TESTS != null) {
-        on('before:browser:launch', (browser, launchOptions) => {
-            if (browser.name === 'chrome' || browser.name === 'chromium') {
+    on('before:browser:launch', (browser, launchOptions) => {
+        if (browser.name === 'chrome' || browser.name === 'chromium') {
+            if (process.env.PLATFORM_TESTS) {
                 let windowSizeArg = windowSize.sberbox;
 
                 if (config.userAgent) {
                     windowSizeArg = windowSize[config.userAgent];
                 }
 
                 launchOptions.args.push(`--window-size=${windowSizeArg}`);
-                launchOptions.args.push('--disable-dev-shm-usage');
+            } else {
+                launchOptions.args.push(`--window-size=3840,2160`);
             }
 
-            return launchOptions;
-        });
-    }
+            launchOptions.args.push('--disable-dev-shm-usage');
+        }
+
+        return launchOptions;
+    });
 
     // это нужно для вывода отчета axe
     on('task', {