Добавлены тесты производительности с помощью Reassure

.github/workflows/lint.yml

@@ -0,0 +1,24 @@
+name: Lint
+
+on:
+  push:
+    branches: [main]
+  pull_request:
+    branches: ["**"]
+
+concurrency:
+  group: ${{ github.workflow }}-${{ github.head_ref }}
+  cancel-in-progress: true
+
+jobs:
+  lint:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v6
+
+      - name: Setup Node.js with Dependencies
+        uses: ./.github/actions/setup-node
+
+      - name: Lint
+        run: yarn lint:check

.github/workflows/perfomance-stability.yml

@@ -0,0 +1,23 @@
+name: Test Performance Stability
+
+on: [workflow_dispatch]
+
+permissions: read-all
+
+concurrency:
+  group: ${{ github.workflow }}-${{ github.ref }}
+  cancel-in-progress: ${{ !contains(github.ref, 'main')}}
+
+jobs:
+  test:
+    name: Performance Stability
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v6
+
+      - name: Setup Node.js with Dependencies
+        uses: ./.github/actions/setup-node
+
+      - name: Run stability checks
+        run: yarn reassure check-stability

.github/workflows/performance-test.yml

@@ -0,0 +1,45 @@
+name: Performance Tests
+
+on:
+  push:
+    branches: [main]
+  pull_request:
+    branches: ["**"]
+
+permissions:
+  pull-requests: write # required for Danger to post comments
+  statuses: write # required for Danger to post commit statuses
+
+concurrency:
+  group: ${{ github.workflow }}-${{ github.head_ref }}
+  cancel-in-progress: true
+
+jobs:
+  test_performance:
+    name: Performance Tests
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v6
+        with:
+          fetch-depth: 0 # Required for git operations in reassure-tests.sh
+
+      - name: Setup Node.js with Dependencies
+        uses: ./.github/actions/setup-node
+
+      - name: Run Reassure Performance Tests
+        run: ./reassure-tests.sh
+        env:
+          REASSURE_OUTPUT_FILE: .reassure/output.md
+
+      - name: Run Danger
+        run: yarn danger ci
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+
+      - name: Upload Reassure report
+        uses: actions/upload-artifact@v4
+        if: always()
+        with:
+          name: reassure-report
+          path: .reassure/output.md

.github/workflows/test.yml

@@ -0,0 +1,24 @@
+name: Tests
+
+on:
+  push:
+    branches: [main]
+  pull_request:
+    branches: ["**"]
+
+concurrency:
+  group: ${{ github.workflow }}-${{ github.head_ref }}
+  cancel-in-progress: true
+
+jobs:
+  test:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v6
+
+      - name: Setup Node.js with Dependencies
+        uses: ./.github/actions/setup-node
+
+      - name: Test
+        run: yarn test

.github/workflows/typecheck.yml

@@ -0,0 +1,24 @@
+name: Typecheck
+
+on:
+  push:
+    branches: [main]
+  pull_request:
+    branches: ["**"]
+
+concurrency:
+  group: ${{ github.workflow }}-${{ github.head_ref }}
+  cancel-in-progress: true
+
+jobs:
+  typecheck:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v6
+
+      - name: Setup Node.js with Dependencies
+        uses: ./.github/actions/setup-node
+
+      - name: Typecheck
+        run: yarn tsc --noEmit

.gitignore

@@ -55,3 +55,5 @@ web-build/
 
 # direnv
 .envrc
+# Reassure output directory
+.reassure

.npmignore

@@ -49,4 +49,7 @@ expo
 .prettierignore
 .vscode
 xcode-installation.png
-configs
+configs
+dangerfile.js
+.reassure
+reassure-tests.sh

configs/eslint/rules/reactNative.ts

@@ -39,7 +39,7 @@ export const reactNativeConfig = defineConfig([
     },
   },
   {
-    files: ['**/*.{test,spec}.{js,jsx,cjs,mjs,ts,tsx,mts,cts}'],
+    files: ['**/*.{test,spec,perf-test}.{js,jsx,cjs,mjs,ts,tsx,mts,cts}'],
     rules: {
       'react-native/no-inline-styles': 'off',
       'react-native/no-raw-text': 'off',
@@ -50,6 +50,7 @@ export const reactNativeConfig = defineConfig([
     rules: {
       'react-native/no-inline-styles': 'off',
       'react-native/no-raw-text': 'off',
+      'react-native/no-color-literals': 'off',
     },
   },
 ])

dangerfile.js

@@ -0,0 +1,6 @@
+// eslint-disable-next-line import-x/no-nodejs-modules
+import path from 'path'
+
+import { dangerReassure } from 'reassure'
+
+dangerReassure({ inputFilePath: path.join(__dirname, './.reassure/output.md') })

jest.config.ts

@@ -10,7 +10,9 @@ const config: Config.InitialOptions = {
     '!**/*.stories.{ts,tsx}',
     '!**/index.ts',
     '!**/types.ts',
+    '!**/__tests__/*',
   ],
+  testMatch: ['**/__tests__/**/*.{spec,test}.{ts,tsx}'],
   coverageReporters: ['text', 'text-summary'],
   moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'json', 'node'],
   testRunner: 'jest-circus',

package.json

@@ -109,6 +109,7 @@
     "react-native-reanimated": "3.19.1",
     "react-native-safe-area-context": "5.6.1",
     "react-native-svg": "15.12.1",
+    "reassure": "1.4.0",
     "release-it": "19.0.6",
     "standard-version": "9.5.0",
     "storybook": "8.3.5",

reassure-tests.sh

@@ -0,0 +1,19 @@
+#!/usr/bin/env bash
+set -e 
+
+BASELINE_BRANCH=${GITHUB_BASE_REF:="main"}
+
+# Required for `git switch` on CI
+git fetch origin
+
+# Gather baseline perf measurements
+git switch "$BASELINE_BRANCH"
+
+yarn install --immutable
+yarn reassure --baseline
+
+# Gather current perf measurements & compare results
+git switch --detach -
+
+yarn install --immutable
+yarn reassure --branch

src/components/Accordion/__tests__/Accordion.perf-test.tsx

@@ -0,0 +1,77 @@
+import { IconUser, IconDiamond } from '@tabler/icons-react-native'
+import { fireEvent, screen } from '@testing-library/react-native'
+import { View } from 'react-native'
+
+import { measureComponentPerformance } from '../../../utils/__tests__/perf-utils'
+import { Accordion, AccordionTestIds } from '../Accordion'
+
+describe('Accordion performance', () => {
+  test('initial render (collapsed)', async () => {
+    await measureComponentPerformance(
+      <Accordion title='Accordion'>
+        <View style={{ height: 100 }} />
+      </Accordion>
+    )
+  })
+
+  test('initial render (expanded)', async () => {
+    await measureComponentPerformance(
+      <Accordion isInitiallyExpanded title='Accordion'>
+        <View style={{ height: 100 }} />
+      </Accordion>
+    )
+  })
+
+  test('initial render with Icon', async () => {
+    await measureComponentPerformance(
+      <Accordion Icon={IconUser} title='Accordion'>
+        <View style={{ height: 100 }} />
+      </Accordion>
+    )
+  })
+
+  test('initial render with titleExtra', async () => {
+    await measureComponentPerformance(
+      <Accordion title='Accordion' titleExtra={<IconDiamond />}>
+        <View style={{ height: 100 }} />
+      </Accordion>
+    )
+  })
+
+  test('initial render with withSeparator', async () => {
+    await measureComponentPerformance(
+      <Accordion withSeparator title='Accordion'>
+        <View style={{ height: 100 }} />
+      </Accordion>
+    )
+  })
+
+  test('initial render when disabled', async () => {
+    await measureComponentPerformance(
+      <Accordion disabled title='Accordion'>
+        <View style={{ height: 100 }} />
+      </Accordion>
+    )
+  })
+
+  test('toggle performance', async () => {
+    const scenario = async () => {
+      fireEvent(
+        screen.getByTestId(AccordionTestIds.contentWrapper, {
+          includeHiddenElements: true,
+        }),
+        'layout',
+        { nativeEvent: { layout: { height: 100, width: 200, x: 0, y: 0 } } }
+      )
+
+      fireEvent.press(screen.getByText('Accordion'))
+    }
+
+    await measureComponentPerformance(
+      <Accordion title='Accordion'>
+        <View style={{ height: 100 }} />
+      </Accordion>,
+      { scenario }
+    )
+  })
+})

src/components/Avatar/__tests__/Avatar.perf-test.tsx

@@ -0,0 +1,86 @@
+import { IconUser } from '@tabler/icons-react-native'
+
+import { measureComponentPerformance } from '../../../utils/__tests__/perf-utils'
+import { Badge } from '../../Badge'
+
+import { Avatar } from '../Avatar'
+
+describe('Avatar performance', () => {
+  test('label', async () => {
+    await measureComponentPerformance(
+      <Avatar shape='circle' size='large' type='label'>
+        A
+      </Avatar>
+    )
+  })
+
+  test('icon', async () => {
+    await measureComponentPerformance(
+      <Avatar Icon={IconUser} shape='circle' size='large' type='icon' />
+    )
+  })
+
+  test('image', async () => {
+    await measureComponentPerformance(
+      <Avatar
+        shape='circle'
+        size='large'
+        source={require('../testImage.png')}
+        type='image'
+      />
+    )
+  })
+
+  test('size normal', async () => {
+    await measureComponentPerformance(
+      <Avatar shape='circle' size='normal' type='label'>
+        A
+      </Avatar>
+    )
+  })
+
+  test('size large', async () => {
+    await measureComponentPerformance(
+      <Avatar shape='circle' size='large' type='label'>
+        A
+      </Avatar>
+    )
+  })
+
+  test('size xlarge', async () => {
+    await measureComponentPerformance(
+      <Avatar shape='circle' size='xlarge' type='label'>
+        A
+      </Avatar>
+    )
+  })
+
+  test('size custom', async () => {
+    await measureComponentPerformance(
+      <Avatar shape='circle' size={100} type='label'>
+        A
+      </Avatar>
+    )
+  })
+
+  test('shape square', async () => {
+    await measureComponentPerformance(
+      <Avatar shape='square' size='large' type='label'>
+        A
+      </Avatar>
+    )
+  })
+
+  test('with badge', async () => {
+    await measureComponentPerformance(
+      <Avatar
+        badge={<Badge severity='danger'>9</Badge>}
+        shape='circle'
+        size='large'
+        type='label'
+      >
+        A
+      </Avatar>
+    )
+  })
+})