diff --git a/apps/common-app/.eslintrc.js b/apps/common-app/.eslintrc.js index 5f020ca7663a..891bf3933b0c 100644 --- a/apps/common-app/.eslintrc.js +++ b/apps/common-app/.eslintrc.js @@ -14,4 +14,13 @@ module.exports = { 'reanimated/animated-style-non-animated-component': 'error', 'react/jsx-fragments': ['error', 'syntax'], }, + overrides: [ + { + files: ['./src/examples/RuntimeTests/tests/**'], + rules: { + 'no-template-curly-in-string': 'off', + 'no-inline-styles/no-inline-styles': 'off', + }, + }, + ], }; diff --git a/apps/common-app/src/examples/RuntimeTests/ReanimatedRuntimeTestsRunner/RuntimeTestsApi.ts b/apps/common-app/src/examples/RuntimeTests/ReanimatedRuntimeTestsRunner/RuntimeTestsApi.ts index 95731c967404..5dfaa6de4bea 100644 --- a/apps/common-app/src/examples/RuntimeTests/ReanimatedRuntimeTestsRunner/RuntimeTestsApi.ts +++ b/apps/common-app/src/examples/RuntimeTests/ReanimatedRuntimeTestsRunner/RuntimeTestsApi.ts @@ -1,96 +1,82 @@ -import { Component, ReactElement } from 'react'; +import type { Component, ReactElement } from 'react'; import { TestRunner } from './TestRunner'; -import { TestComponent } from './TestComponent'; +import type { TestComponent } from './TestComponent'; import type { SharedValue } from 'react-native-reanimated'; -import { TestConfiguration, TestValue, NullableTestValue, DescribeDecorator, TestDecorator } from './types'; +import type { TestConfiguration, TestValue, NullableTestValue, BuildFunction } from './types'; +import { DescribeDecorator, TestDecorator } from './types'; export { Presets } from './Presets'; const testRunner = new TestRunner(); -type DescribeFunction = (name: string, buildSuite: () => void) => void; -export const describe: { - (name: string, buildSuite: () => void): void; - skip: DescribeFunction; - only: DescribeFunction; -} = Object.assign( - (name: string, buildSuite: () => void) => { - testRunner.describe(name, buildSuite, null); - }, - { - skip: (name: string, buildSuite: () => void) => { - testRunner.describe(name, buildSuite, DescribeDecorator.SKIP); - }, - only: (name: string, buildSuite: () => void) => { - testRunner.describe(name, buildSuite, DescribeDecorator.ONLY); - }, - }, -); - +type DescribeFunction = (name: string, buildSuite: BuildFunction) => void; +type TestFunction = (name: string, buildTest: BuildFunction) => void; +type TestFunctionWithWarning = (name: string, warningMessage: string, buildTest: BuildFunction) => void; type TestEachFunction = ( examples: Array, -) => (name: string, testCase: (example: T, index?: number) => void) => void; +) => (name: string, testCase: (example: T, index?: number) => void | Promise) => void; type TestEachFunctionWithWarning = ( examples: Array, -) => (name: string, expectedWarning: string, testCase: (example: T, index?: number) => void) => void; - -export const test: { - (name: string, testCase: () => void): void; - each: TestEachFunction; - skip: { (name: string, testCase: () => void): void; each: TestEachFunction }; - only: { (name: string, testCase: () => void): void; each: TestEachFunction }; - failing: { (name: string, warningMessage: string, testCase: () => void): void; each: TestEachFunctionWithWarning }; - warn: { (name: string, warningMessage: string, testCase: () => void): void; each: TestEachFunctionWithWarning }; -} = Object.assign( - (name: string, testCase: () => void) => { - testRunner.test(name, testCase, null); - }, - { - each: (examples: Array) => { - return testRunner.testEach(examples, null); - }, - skip: Object.assign( - (name: string, testCase: () => void) => { - testRunner.test(name, testCase, TestDecorator.SKIP); - }, - { - each: (examples: Array) => { - return testRunner.testEach(examples, TestDecorator.SKIP); - }, - }, - ), - only: Object.assign( - (name: string, testCase: () => void) => { - testRunner.test(name, testCase, TestDecorator.ONLY); - }, - { - each: (examples: Array) => { - return testRunner.testEach(examples, TestDecorator.ONLY); - }, - }, - ), - failing: Object.assign( - (name: string, expectedWarning: string, testCase: () => void) => { - testRunner.test(name, testCase, TestDecorator.FAILING, expectedWarning); - }, - { - each: (examples: Array) => { - return testRunner.testEachErrorMsg(examples, TestDecorator.FAILING); - }, - }, - ), - warn: Object.assign( - (name: string, expectedWarning: string, testCase: () => void) => { - testRunner.test(name, testCase, TestDecorator.WARN, expectedWarning); - }, - { - each: (examples: Array) => { - return testRunner.testEachErrorMsg(examples, TestDecorator.WARN); - }, - }, - ), - }, -); +) => (name: string, expectedWarning: string, testCase: (example: T, index?: number) => void | Promise) => void; +type DecoratedTestFunction = TestFunction & { each: TestEachFunction }; +type DecoratedTestFunctionWithWarning = TestFunctionWithWarning & { each: TestEachFunctionWithWarning }; + +const describeBasic = (name: string, buildSuite: BuildFunction) => { + testRunner.describe(name, buildSuite, null); +}; + +export const describe = >describeBasic; +describe.skip = (name, buildSuite) => { + testRunner.describe(name, buildSuite, DescribeDecorator.SKIP); +}; +describe.only = (name, buildSuite) => { + testRunner.describe(name, buildSuite, DescribeDecorator.ONLY); +}; + +const testBasic: DecoratedTestFunction = (name: string, testCase: BuildFunction) => { + testRunner.test(name, testCase, null); +}; +testBasic.each = (examples: Array) => { + return testRunner.testEach(examples, null); +}; +const testSkip: DecoratedTestFunction = (name: string, testCase: BuildFunction) => { + testRunner.test(name, testCase, TestDecorator.SKIP); +}; +testSkip.each = (examples: Array) => { + return testRunner.testEach(examples, TestDecorator.SKIP); +}; +const testOnly: DecoratedTestFunction = (name: string, testCase: BuildFunction) => { + testRunner.test(name, testCase, TestDecorator.ONLY); +}; +testOnly.each = (examples: Array) => { + return testRunner.testEach(examples, TestDecorator.ONLY); +}; +const testFailing: DecoratedTestFunctionWithWarning = ( + name: string, + expectedWarning: string, + testCase: BuildFunction, +) => { + testRunner.test(name, testCase, TestDecorator.FAILING, expectedWarning); +}; +testFailing.each = (examples: Array) => { + return testRunner.testEachErrorMsg(examples, TestDecorator.FAILING); +}; +const testWarn: DecoratedTestFunctionWithWarning = (name: string, expectedWarning: string, testCase: BuildFunction) => { + testRunner.test(name, testCase, TestDecorator.WARN, expectedWarning); +}; +testWarn.each = (examples: Array) => { + return testRunner.testEachErrorMsg(examples, TestDecorator.WARN); +}; + +type TestType = DecoratedTestFunction & + Record & + Record; + +export const test = testBasic; +test.skip = testSkip; +test.only = testOnly; +test.failing = testFailing; +test.warn = testWarn; export function beforeAll(job: () => void) { testRunner.beforeAll(job); @@ -120,6 +106,7 @@ export function useTestRef(name: string) { return testRunner.useTestRef(name); } +// eslint-disable-next-line @typescript-eslint/unbound-method const testRunnerCallTrackerFn = testRunner.callTracker; export function callTracker(name: string) { 'worklet'; @@ -158,8 +145,9 @@ export async function wait(delay: number) { return testRunner.wait(delay); } +// eslint-disable-next-line @typescript-eslint/unbound-method const testRunnerNotifyFn = testRunner.notify; -export async function notify(name: string) { +export function notify(name: string) { 'worklet'; return testRunnerNotifyFn(name); } @@ -209,5 +197,5 @@ export async function recordAnimationUpdates() { } export async function stopRecordingAnimationUpdates() { - testRunner.stopRecordingAnimationUpdates(); + await testRunner.stopRecordingAnimationUpdates(); } diff --git a/apps/common-app/src/examples/RuntimeTests/ReanimatedRuntimeTestsRunner/TestRunner.ts b/apps/common-app/src/examples/RuntimeTests/ReanimatedRuntimeTestsRunner/TestRunner.ts index fad01f538c3b..39532648d9e8 100644 --- a/apps/common-app/src/examples/RuntimeTests/ReanimatedRuntimeTestsRunner/TestRunner.ts +++ b/apps/common-app/src/examples/RuntimeTests/ReanimatedRuntimeTestsRunner/TestRunner.ts @@ -1,22 +1,23 @@ -import { Component, MutableRefObject, ReactElement, useRef } from 'react'; -import { - type NullableTestValue, - type LockObject, - type Operation, - type SharedValueSnapshot, - type TestCase, - type TestConfiguration, - type TestSuite, - type TestSummary, - type TestValue, - type TrackerCallCount, - ComparisonMode, - DescribeDecorator, - TestDecorator, +import type { Component, MutableRefObject, ReactElement } from 'react'; +import { useRef } from 'react'; +import type { + BuildFunction, + NullableTestValue, + LockObject, + Operation, + SharedValueSnapshot, + TestCase, + TestConfiguration, + TestSuite, + TestSummary, + TestValue, + TrackerCallCount, } from './types'; +import { ComparisonMode, DescribeDecorator, TestDecorator } from './types'; import { TestComponent } from './TestComponent'; import { getTrackerCallCount, render, stopRecordingAnimationUpdates, unmockAnimationTimer } from './RuntimeTestsApi'; -import { makeMutable, runOnUI, runOnJS, SharedValue } from 'react-native-reanimated'; +import type { SharedValue } from 'react-native-reanimated'; +import { makeMutable, runOnUI, runOnJS } from 'react-native-reanimated'; import { applyMarkdown, color, formatString, indentNestingLevel } from './stringFormatUtils'; import { createUpdatesContainer } from './UpdatesContainer'; import { Matchers, nullableMatch } from './Matchers'; @@ -101,7 +102,7 @@ export class TestRunner { return await this.render(null); } - public describe(name: string, buildSuite: () => void, decorator: DescribeDecorator | null) { + public describe(name: string, buildSuite: BuildFunction, decorator: DescribeDecorator | null) { if (decorator === DescribeDecorator.ONLY) { this._includesOnly = true; } @@ -127,11 +128,12 @@ export class TestRunner { buildSuite, testCases: [], nestingLevel: (this._currentTestSuite?.nestingLevel || 0) + 1, + // eslint-disable-next-line no-unneeded-ternary decorator: decorator ? decorator : this._currentTestSuite?.decorator ? this._currentTestSuite?.decorator : null, }); } - public test(name: string, run: () => void, decorator: TestDecorator | null, warningMessage = '') { + public test(name: string, run: BuildFunction, decorator: TestDecorator | null, warningMessage = '') { assertTestSuite(this._currentTestSuite); if (decorator === TestDecorator.ONLY) { this._includesOnly = true; @@ -145,7 +147,7 @@ export class TestRunner { callsRegistry: {}, errors: [], decorator, - warningMessage: warningMessage, + warningMessage, skip: false, } : { @@ -161,7 +163,7 @@ export class TestRunner { } public testEachErrorMsg(examples: Array, decorator: TestDecorator) { - return (name: string, expectedWarning: string, testCase: (example: T) => void) => { + return (name: string, expectedWarning: string, testCase: (example: T) => void | Promise) => { examples.forEach((example, index) => { const currentTestCase = async () => { await testCase(example); @@ -175,8 +177,9 @@ export class TestRunner { }); }; } + public testEach(examples: Array, decorator: TestDecorator | null) { - return (name: string, testCase: (example: T, index?: number) => void) => { + return (name: string, testCase: (example: T, index?: number) => void | Promise) => { examples.forEach((example, index) => { const currentTestCase = async () => { await testCase(example, index); @@ -260,7 +263,9 @@ export class TestRunner { for (const testCase of testSuite.testCases) { if (testCase.decorator === TestDecorator.ONLY) { skipTestSuite = false; - } else testCase.skip = testCase.skip || !(testSuite.decorator === DescribeDecorator.ONLY); + } else { + testCase.skip = testCase.skip || !(testSuite.decorator === DescribeDecorator.ONLY); + } } } testSuite.skip = skipTestSuite; @@ -323,6 +328,7 @@ export class TestRunner { console.error = newConsoleFuncJS; console.warn = newConsoleFuncJS; + // eslint-disable-next-line @typescript-eslint/unbound-method const callTrackerCopy = this.callTracker; runOnUI(() => { @@ -500,12 +506,13 @@ export class TestRunner { return global.mockedAnimationTimestamp; }; - let originalRequestAnimationFrame = global.requestAnimationFrame; + const originalRequestAnimationFrame = global.requestAnimationFrame; global.originalRequestAnimationFrame = originalRequestAnimationFrame; - (global as any).requestAnimationFrame = (callback: Function) => { + global.requestAnimationFrame = (callback: (time: number) => void) => { originalRequestAnimationFrame(() => { callback(global._getAnimationTimestamp()); }); + return 0; }; global.originalFlushAnimationFrame = global.__flushAnimationFrame; diff --git a/apps/common-app/src/examples/RuntimeTests/ReanimatedRuntimeTestsRunner/types.ts b/apps/common-app/src/examples/RuntimeTests/ReanimatedRuntimeTestsRunner/types.ts index be721d4dc3cf..4798d6206f89 100644 --- a/apps/common-app/src/examples/RuntimeTests/ReanimatedRuntimeTestsRunner/types.ts +++ b/apps/common-app/src/examples/RuntimeTests/ReanimatedRuntimeTestsRunner/types.ts @@ -1,5 +1,5 @@ -import { Component, Dispatch, MutableRefObject, ReactNode, SetStateAction } from 'react'; -import { AnimatedStyle, StyleProps } from 'react-native-reanimated'; +import type { Component, Dispatch, MutableRefObject, ReactNode, SetStateAction } from 'react'; +import type { AnimatedStyle, StyleProps } from 'react-native-reanimated'; export type CallTracker = { UICallsCount: number; @@ -25,22 +25,22 @@ export type SharedValueSnapshot = { export type ComponentRef = MutableRefObject<(Component & { props: { style: Record } }) | null>; export enum DescribeDecorator { - ONLY = 'ONLY', - SKIP = 'SKIP', - NONE = 'NONE', + ONLY = 'only', + SKIP = 'skip', } export enum TestDecorator { - ONLY = 'ONLY', - SKIP = 'SKIP', - FAILING = 'FAILING', - WARN = 'WARN', - NONE = 'NONE', + ONLY = 'only', + SKIP = 'skip', + FAILING = 'failing', + WARN = 'warn', } +export type BuildFunction = () => void | Promise; + export type TestCase = { name: string; - run: () => void | Promise; + run: BuildFunction; componentsRefs: Record; callsRegistry: Record; errors: string[]; @@ -55,7 +55,7 @@ export type TestCase = { export type TestSuite = { name: string; - buildSuite: () => void; + buildSuite: BuildFunction; testCases: TestCase[]; nestingLevel: number; beforeAll?: () => void | Promise; @@ -104,6 +104,7 @@ export type TestConfiguration = { render: Dispatch>; }; +/* eslint-disable no-var */ declare global { var mockedAnimationTimestamp: number | undefined; var originalRequestAnimationFrame: ((callback: (timestamp: number) => void) => void) | undefined; @@ -123,6 +124,7 @@ declare global { var _obtainPropFabric: (shadowNodeWrapper: unknown, propName: string) => string; var __flushAnimationFrame: (frameTimestamp: number) => void; } +/* eslint-enable no-var */ export type TestSummary = { passed: number; diff --git a/apps/common-app/src/examples/RuntimeTests/tests/Animations.test.tsx b/apps/common-app/src/examples/RuntimeTests/tests/Animations.test.tsx index 8c95ab039ba5..b7f5d2892628 100644 --- a/apps/common-app/src/examples/RuntimeTests/tests/Animations.test.tsx +++ b/apps/common-app/src/examples/RuntimeTests/tests/Animations.test.tsx @@ -1,4 +1,3 @@ -/* eslint-disable no-inline-styles/no-inline-styles */ import React, { useEffect } from 'react'; import { View, Text } from 'react-native'; import Animated, { useSharedValue, useAnimatedStyle, withTiming, FadeIn, runOnUI } from 'react-native-reanimated'; diff --git a/apps/common-app/src/examples/RuntimeTests/tests/advancedAPI/measure.test.tsx b/apps/common-app/src/examples/RuntimeTests/tests/advancedAPI/measure.test.tsx index d0b09588ece3..9b3363876bfc 100644 --- a/apps/common-app/src/examples/RuntimeTests/tests/advancedAPI/measure.test.tsx +++ b/apps/common-app/src/examples/RuntimeTests/tests/advancedAPI/measure.test.tsx @@ -1,5 +1,6 @@ import React, { useEffect } from 'react'; import { StyleSheet, View } from 'react-native'; +import type { AnimatableValueObject, MeasuredDimensions } from 'react-native-reanimated'; import Animated, { runOnUI, measure, @@ -8,9 +9,7 @@ import Animated, { withDelay, withTiming, useAnimatedStyle, - AnimatableValueObject, Easing, - MeasuredDimensions, useFrameCallback, } from 'react-native-reanimated'; import { diff --git a/apps/common-app/src/examples/RuntimeTests/tests/advancedAPI/useFrameCallback.test.tsx b/apps/common-app/src/examples/RuntimeTests/tests/advancedAPI/useFrameCallback.test.tsx index 57b368be416c..8dc63adb0094 100644 --- a/apps/common-app/src/examples/RuntimeTests/tests/advancedAPI/useFrameCallback.test.tsx +++ b/apps/common-app/src/examples/RuntimeTests/tests/advancedAPI/useFrameCallback.test.tsx @@ -1,7 +1,6 @@ -import { useEffect } from 'react'; +import React, { useEffect } from 'react'; import { View, StyleSheet } from 'react-native'; import Animated, { useSharedValue, useAnimatedStyle, useFrameCallback } from 'react-native-reanimated'; -import React from 'react'; import { describe, test, diff --git a/apps/common-app/src/examples/RuntimeTests/tests/animations/withDecay/basic.test.tsx b/apps/common-app/src/examples/RuntimeTests/tests/animations/withDecay/basic.test.tsx index 97ab0bf75bed..3d1b42f4d0f2 100644 --- a/apps/common-app/src/examples/RuntimeTests/tests/animations/withDecay/basic.test.tsx +++ b/apps/common-app/src/examples/RuntimeTests/tests/animations/withDecay/basic.test.tsx @@ -1,5 +1,6 @@ import { View, StyleSheet } from 'react-native'; -import Animated, { useAnimatedStyle, withDecay, WithDecayConfig } from 'react-native-reanimated'; +import type { WithDecayConfig } from 'react-native-reanimated'; +import Animated, { useAnimatedStyle, withDecay } from 'react-native-reanimated'; import React from 'react'; import { describe, diff --git a/apps/common-app/src/examples/RuntimeTests/tests/animations/withSpring/variousConfig.test.tsx b/apps/common-app/src/examples/RuntimeTests/tests/animations/withSpring/variousConfig.test.tsx index 75a0ee9ae00d..418e579855d7 100644 --- a/apps/common-app/src/examples/RuntimeTests/tests/animations/withSpring/variousConfig.test.tsx +++ b/apps/common-app/src/examples/RuntimeTests/tests/animations/withSpring/variousConfig.test.tsx @@ -1,7 +1,7 @@ -import { useEffect } from 'react'; +import React, { useEffect } from 'react'; import { View, StyleSheet } from 'react-native'; -import Animated, { useSharedValue, useAnimatedStyle, withSpring, WithSpringConfig } from 'react-native-reanimated'; -import React from 'react'; +import type { WithSpringConfig } from 'react-native-reanimated'; +import Animated, { useSharedValue, useAnimatedStyle, withSpring } from 'react-native-reanimated'; import { describe, test, diff --git a/apps/common-app/src/examples/RuntimeTests/tests/animations/withTiming/arrays.test.tsx b/apps/common-app/src/examples/RuntimeTests/tests/animations/withTiming/arrays.test.tsx index f88406c26bf3..909befac7aaa 100644 --- a/apps/common-app/src/examples/RuntimeTests/tests/animations/withTiming/arrays.test.tsx +++ b/apps/common-app/src/examples/RuntimeTests/tests/animations/withTiming/arrays.test.tsx @@ -1,7 +1,6 @@ -import { useEffect } from 'react'; +import React, { useEffect } from 'react'; import { View, StyleSheet } from 'react-native'; import Animated, { useSharedValue, useAnimatedStyle, withTiming, withDelay } from 'react-native-reanimated'; -import React from 'react'; import { ComparisonMode } from '../../../ReanimatedRuntimeTestsRunner/types'; import { describe, @@ -91,7 +90,7 @@ describe('withTiming animation of ARRAY', () => { test.each(TEST_CASES)( 'Animate independent components ${speed}ms FROM ${startWidths} TO ${finalWidths}', async ({ startWidths, finalWidths, scalars: passedScalars, speed }) => { - const scalars: [number, number, number] = passedScalars ? passedScalars : [1, 1, 1]; + const scalars: [number, number, number] = passedScalars || [1, 1, 1]; await render( { />, ); const components = Object.values(COMPONENT_REF).map(refName => getTestComponent(refName)); - - components.forEach(async (component, index) => { + let index = 0; + index = 0; + for (const component of components) { expect(await component.getAnimatedStyle('width')).toBe( startWidths[index] * scalars[index], ComparisonMode.DISTANCE, ); - }); + index += 1; + } await wait(speed + 200); - - components.forEach(async (component, index) => { + index = 0; + for (const component of components) { expect(await component.getAnimatedStyle('width')).toBe(finalWidths[index], ComparisonMode.DISTANCE); - }); + index += 1; + } }, ); }); diff --git a/apps/common-app/src/examples/RuntimeTests/tests/animations/withTiming/basic.test.tsx b/apps/common-app/src/examples/RuntimeTests/tests/animations/withTiming/basic.test.tsx index d017fb9828a2..eb7d9d518393 100644 --- a/apps/common-app/src/examples/RuntimeTests/tests/animations/withTiming/basic.test.tsx +++ b/apps/common-app/src/examples/RuntimeTests/tests/animations/withTiming/basic.test.tsx @@ -1,7 +1,6 @@ -import { useEffect } from 'react'; +import React, { useEffect } from 'react'; import { View, StyleSheet, Dimensions } from 'react-native'; import Animated, { useSharedValue, useAnimatedStyle, withTiming, withDelay } from 'react-native-reanimated'; -import React from 'react'; import { ComparisonMode } from '../../../ReanimatedRuntimeTestsRunner/types'; import { describe, diff --git a/apps/common-app/src/examples/RuntimeTests/tests/animations/withTiming/colors.test.tsx b/apps/common-app/src/examples/RuntimeTests/tests/animations/withTiming/colors.test.tsx index ca474fe4ad24..b114d56cf212 100644 --- a/apps/common-app/src/examples/RuntimeTests/tests/animations/withTiming/colors.test.tsx +++ b/apps/common-app/src/examples/RuntimeTests/tests/animations/withTiming/colors.test.tsx @@ -1,7 +1,6 @@ -import { useEffect } from 'react'; +import React, { useEffect } from 'react'; import { View, StyleSheet } from 'react-native'; import Animated, { useSharedValue, useAnimatedStyle, withTiming, withDelay } from 'react-native-reanimated'; -import React from 'react'; import { ComparisonMode } from '../../../ReanimatedRuntimeTestsRunner/types'; import { describe, diff --git a/apps/common-app/src/examples/RuntimeTests/tests/animations/withTiming/easing.test.tsx b/apps/common-app/src/examples/RuntimeTests/tests/animations/withTiming/easing.test.tsx index 8bc931e044cb..128c459cda72 100644 --- a/apps/common-app/src/examples/RuntimeTests/tests/animations/withTiming/easing.test.tsx +++ b/apps/common-app/src/examples/RuntimeTests/tests/animations/withTiming/easing.test.tsx @@ -1,14 +1,7 @@ -import { useEffect } from 'react'; +import React, { useEffect } from 'react'; import { View, StyleSheet, Easing as EasingRN } from 'react-native'; -import Animated, { - useSharedValue, - useAnimatedStyle, - withTiming, - Easing, - EasingFunction, - EasingFunctionFactory, -} from 'react-native-reanimated'; -import React from 'react'; +import type { EasingFunction, EasingFunctionFactory } from 'react-native-reanimated'; +import Animated, { useSharedValue, useAnimatedStyle, withTiming, Easing } from 'react-native-reanimated'; import { describe, test, @@ -88,7 +81,7 @@ async function getSnapshotUpdates(easingFn: EasingFunction | EasingFunctionFacto } describe('withTiming snapshots 📸, test EASING', () => { - describe('Invalid easing', async () => { + describe('Invalid easing', () => { test.failing( 'Easing imported from react-native throws an error', 'Error: [Reanimated] The easing function is not a worklet. Please make sure you import `Easing` from react-native-reanimated.', @@ -144,13 +137,13 @@ describe('withTiming snapshots 📸, test EASING', () => { [Easing.steps, [1.5, true]], [Easing.steps, [1.5, false]], ])('Easing.${0}(${1})', async ([easing, argumentSet]) => { - const snapshotName = `${(easing as Function).name}_${(argumentSet as any) + const snapshotName = `${(easing as () => void).name}_${(argumentSet as Array) .join('_') .replace(/\./g, '$') .replace(/-/g, '$')}`; const [activeUpdates, activeNativeUpdates, passiveUpdates] = await getSnapshotUpdates( - //@ts-ignore This error is because various easing functions accept different number of arguments + // @ts-ignore This error is because various easing functions accept different number of arguments easing(...argumentSet), ); expect(activeUpdates).toMatchSnapshots(EasingSnapshots[snapshotName as keyof typeof EasingSnapshots]); diff --git a/apps/common-app/src/examples/RuntimeTests/tests/animations/withTiming/objects.test.tsx b/apps/common-app/src/examples/RuntimeTests/tests/animations/withTiming/objects.test.tsx index ef79e97c7e44..3383638e4534 100644 --- a/apps/common-app/src/examples/RuntimeTests/tests/animations/withTiming/objects.test.tsx +++ b/apps/common-app/src/examples/RuntimeTests/tests/animations/withTiming/objects.test.tsx @@ -1,13 +1,8 @@ -import { useEffect } from 'react'; +import React, { useEffect } from 'react'; import { View, StyleSheet } from 'react-native'; -import Animated, { - useSharedValue, - useAnimatedStyle, - withTiming, - withDelay, - AnimatableValueObject, -} from 'react-native-reanimated'; -import React from 'react'; +import type { AnimatableValueObject } from 'react-native-reanimated'; +import Animated, { useSharedValue, useAnimatedStyle, withTiming, withDelay } from 'react-native-reanimated'; +import type { ValidPropNames } from '../../../ReanimatedRuntimeTestsRunner/types'; import { ComparisonMode } from '../../../ReanimatedRuntimeTestsRunner/types'; import { describe, @@ -18,7 +13,6 @@ import { getTestComponent, wait, } from '../../../ReanimatedRuntimeTestsRunner/RuntimeTestsApi'; -import { ValidPropNames } from '../../../ReanimatedRuntimeTestsRunner/TestComponent'; const COMPONENT_REF = 'AnimatedComponent'; @@ -85,12 +79,12 @@ describe('withTiming animation of WIDTH', () => { await render(); const component = getTestComponent(COMPONENT_REF); await wait(1000); - Object.keys(finalStyle).forEach(async key => { + for (const key of Object.keys(finalStyle)) { expect(await component.getAnimatedStyle(key as ValidPropNames)).toBe( finalStyle[key], comparisonModes[key as keyof typeof comparisonModes], ); - }); + } }, ); }); diff --git a/apps/common-app/src/examples/RuntimeTests/tests/animations/withTiming/transformMatrices.test.tsx b/apps/common-app/src/examples/RuntimeTests/tests/animations/withTiming/transformMatrices.test.tsx index e613ad3154d5..c58e32c39a25 100644 --- a/apps/common-app/src/examples/RuntimeTests/tests/animations/withTiming/transformMatrices.test.tsx +++ b/apps/common-app/src/examples/RuntimeTests/tests/animations/withTiming/transformMatrices.test.tsx @@ -1,7 +1,6 @@ -import { useEffect } from 'react'; +import React, { useEffect } from 'react'; import { View, StyleSheet } from 'react-native'; import Animated, { useSharedValue, useAnimatedStyle, withTiming } from 'react-native-reanimated'; -import React from 'react'; import { describe, test, diff --git a/apps/common-app/src/examples/RuntimeTests/tests/core/cancelAnimation.test.tsx b/apps/common-app/src/examples/RuntimeTests/tests/core/cancelAnimation.test.tsx index 37d954b41a35..e08de324eeff 100644 --- a/apps/common-app/src/examples/RuntimeTests/tests/core/cancelAnimation.test.tsx +++ b/apps/common-app/src/examples/RuntimeTests/tests/core/cancelAnimation.test.tsx @@ -1,4 +1,4 @@ -import { useEffect } from 'react'; +import React, { useEffect } from 'react'; import { View, StyleSheet } from 'react-native'; import Animated, { useSharedValue, @@ -8,7 +8,6 @@ import Animated, { Easing, useDerivedValue, } from 'react-native-reanimated'; -import React from 'react'; import { describe, test, diff --git a/apps/common-app/src/examples/RuntimeTests/tests/core/useAnimatedStyle/reuseAnimatedStyle.test.tsx b/apps/common-app/src/examples/RuntimeTests/tests/core/useAnimatedStyle/reuseAnimatedStyle.test.tsx index c9f7da38dc99..8df9c8188f5b 100644 --- a/apps/common-app/src/examples/RuntimeTests/tests/core/useAnimatedStyle/reuseAnimatedStyle.test.tsx +++ b/apps/common-app/src/examples/RuntimeTests/tests/core/useAnimatedStyle/reuseAnimatedStyle.test.tsx @@ -1,7 +1,7 @@ -import { useEffect } from 'react'; +import React, { useEffect } from 'react'; import { View, StyleSheet } from 'react-native'; -import Animated, { useSharedValue, useAnimatedStyle, withTiming, AnimatableValueObject } from 'react-native-reanimated'; -import React from 'react'; +import type { AnimatableValueObject } from 'react-native-reanimated'; +import Animated, { useSharedValue, useAnimatedStyle, withTiming } from 'react-native-reanimated'; import { ComparisonMode } from '../../../ReanimatedRuntimeTestsRunner/types'; import { describe, @@ -115,7 +115,7 @@ describe('Test reusing animatedStyles', () => { expect(await componentThree.getAnimatedStyle('top')).toBe(top + 5 * margin + 2 * height, ComparisonMode.DISTANCE); // Check the remaining props - for (let key of ['width', 'height', 'left', 'opacity', 'backgroundColor'] as const) { + for (const key of ['width', 'height', 'left', 'opacity', 'backgroundColor'] as const) { if (key in Object.keys(finalStyle)) { const currentVal = await componentOne.getAnimatedStyle(key); expect(currentVal).toBe(finalStyle[key], getComparisonModeForProp(key)); diff --git a/apps/common-app/src/examples/RuntimeTests/tests/core/useDerivedValue/basic.test.tsx b/apps/common-app/src/examples/RuntimeTests/tests/core/useDerivedValue/basic.test.tsx index fa5971d1f86f..43db2cc6ac6d 100644 --- a/apps/common-app/src/examples/RuntimeTests/tests/core/useDerivedValue/basic.test.tsx +++ b/apps/common-app/src/examples/RuntimeTests/tests/core/useDerivedValue/basic.test.tsx @@ -1,4 +1,4 @@ -import { useEffect } from 'react'; +import React, { useEffect } from 'react'; import { View, StyleSheet } from 'react-native'; import Animated, { useSharedValue, @@ -7,7 +7,6 @@ import Animated, { useDerivedValue, withSpring, } from 'react-native-reanimated'; -import React from 'react'; import { ComparisonMode } from '../../../ReanimatedRuntimeTestsRunner/types'; import { describe, @@ -204,7 +203,7 @@ describe('Test useDerivedValue changing width', () => { const snapshotName = `width_${animationType}_${snapshotIdPerType[animate]}_${startWidth}_${finalWidth}`.replace(/\./g, '$'); - let [updates, nativeUpdates] = await getSnapshotUpdatesAndCheckFinalValue( + const [updates, nativeUpdates] = await getSnapshotUpdatesAndCheckFinalValue( startWidth, finalWidth, animate, diff --git a/apps/common-app/src/examples/RuntimeTests/tests/core/useDerivedValue/chain.test.tsx b/apps/common-app/src/examples/RuntimeTests/tests/core/useDerivedValue/chain.test.tsx index 77055e9b561e..443f20c68ca3 100644 --- a/apps/common-app/src/examples/RuntimeTests/tests/core/useDerivedValue/chain.test.tsx +++ b/apps/common-app/src/examples/RuntimeTests/tests/core/useDerivedValue/chain.test.tsx @@ -1,7 +1,6 @@ -import { useEffect } from 'react'; +import React, { useEffect } from 'react'; import { View, StyleSheet } from 'react-native'; import Animated, { useSharedValue, useAnimatedStyle, useDerivedValue, withTiming } from 'react-native-reanimated'; -import React from 'react'; import { describe, render, diff --git a/apps/common-app/src/examples/RuntimeTests/tests/core/useSharedValue.test.tsx b/apps/common-app/src/examples/RuntimeTests/tests/core/useSharedValue.test.tsx index d32272c63375..cd4f77b52d28 100644 --- a/apps/common-app/src/examples/RuntimeTests/tests/core/useSharedValue.test.tsx +++ b/apps/common-app/src/examples/RuntimeTests/tests/core/useSharedValue.test.tsx @@ -1,4 +1,3 @@ -/* eslint-disable no-inline-styles/no-inline-styles */ import React, { useEffect } from 'react'; import { View } from 'react-native'; import { useSharedValue } from 'react-native-reanimated'; @@ -136,7 +135,7 @@ describe('Tests of *****sharedValue*****', () => { await render(); } }); - test.each([BigInt(2), BigInt(-2), BigInt(123456789), BigInt(123456789123456789123456789)])( + test.each([BigInt(2), BigInt(-2), BigInt(123456789), BigInt(1234567891234567)])( 'Test bigInt multiplication *=%p', async (factor: bigint) => { for (const [index, preset] of Presets.bigInts.entries()) {