Skip to content

Commit

Permalink
Rc 056 (#46)
Browse files Browse the repository at this point in the history
* replace jest with vitest

* upgrade storybook
  • Loading branch information
huseyindeniz authored Mar 27, 2024
1 parent 049abc0 commit d9cb837
Show file tree
Hide file tree
Showing 55 changed files with 7,275 additions and 8,079 deletions.
2 changes: 1 addition & 1 deletion .storybook/main.ts
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ const config: StorybookConfig = {
'@storybook/addon-interactions',
'@storybook/addon-a11y',
'@chakra-ui/storybook-addon',
'storybook-addon-react-router-v6',
'storybook-addon-remix-react-router',
'storybook-react-i18next',
],
refs: {
Expand Down
2 changes: 1 addition & 1 deletion .storybook/preview.ts
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ const preview: Preview = {
},
parameters: {
i18n,
actions: { argTypesRegex: '^on[A-Z].*' },
// actions: { argTypesRegex: '^on[A-Z].*' },
controls: {
matchers: {
color: /(background|color)$/i,
Expand Down
14,829 changes: 7,006 additions & 7,823 deletions package-lock.json

Large diffs are not rendered by default.

110 changes: 37 additions & 73 deletions package.json
Original file line number Diff line number Diff line change
@@ -1,119 +1,83 @@
{
"name": "vitedapp",
"private": true,
"version": "0.5.5",
"version": "0.6.0",
"type": "module",
"scripts": {
"dev": "vite",
"build": "tsc && vite build",
"lint": "eslint . --ext ts,tsx --max-warnings 0",
"preview": "vite preview",
"test": "jest --no-cache",
"coverage": "jest --coverage --no-cache",
"test": "vitest",
"coverage": "vitest run --coverage",
"storybook": "storybook dev -p 6006",
"build-storybook": "storybook build",
"extract": "i18next 'src/**/*.{ts,tsx}'"
},
"dependencies": {
"@chakra-ui/react": "^2.8.2",
"@emotion/react": "^11.11.3",
"@emotion/react": "^11.11.4",
"@emotion/styled": "^11.11.0",
"@metamask/jazzicon": "^2.0.0",
"@reduxjs/toolkit": "^2.2.1",
"@reduxjs/toolkit": "^2.2.2",
"ethers": "^6.11.1",
"framer-motion": "^11.0.5",
"i18next": "^23.8.2",
"framer-motion": "^11.0.22",
"i18next": "^23.10.1",
"i18next-browser-languagedetector": "^7.2.0",
"loglevel": "^1.9.1",
"react": "^18.2.0",
"react-cookie-consent": "^9.0.0",
"react-dom": "^18.2.0",
"react-error-boundary": "^4.0.12",
"react-error-boundary": "^4.0.13",
"react-helmet-async": "^2.0.4",
"react-i18next": "^14.0.5",
"react-i18next": "^14.1.0",
"react-icons": "^5.0.1",
"react-redux": "^9.1.0",
"react-router-dom": "^6.22.0",
"react-router-dom": "^6.22.3",
"redux-saga": "^1.3.0"
},
"devDependencies": {
"@chakra-ui/storybook-addon": "^5.1.0",
"@storybook/addon-a11y": "^7.6.16",
"@storybook/addon-essentials": "^7.6.16",
"@storybook/addon-interactions": "^7.6.16",
"@storybook/addon-links": "^7.6.16",
"@storybook/addon-onboarding": "^1.0.11",
"@storybook/blocks": "^7.6.16",
"@storybook/react": "^7.6.16",
"@storybook/react-vite": "^7.6.16",
"@storybook/testing-library": "^0.2.2",
"@storybook/addon-a11y": "^8.0.4",
"@storybook/addon-essentials": "^8.0.4",
"@storybook/addon-interactions": "^8.0.4",
"@storybook/addon-links": "^8.0.4",
"@storybook/addon-onboarding": "^8.0.4",
"@storybook/blocks": "^8.0.4",
"@storybook/manager-api": "^8.0.4",
"@storybook/react": "^8.0.4",
"@storybook/react-vite": "^8.0.4",
"@storybook/theming": "^8.0.4",
"@testing-library/jest-dom": "^6.4.2",
"@testing-library/react": "^14.2.1",
"@testing-library/react": "^14.2.2",
"@testing-library/user-event": "^14.5.2",
"@types/jest": "^29.5.12",
"@types/node": "^20.11.19",
"@types/react": "^18.2.55",
"@types/react-dom": "^18.2.19",
"@types/node": "^20.11.30",
"@types/react": "^18.2.72",
"@types/react-dom": "^18.2.22",
"@types/redux-mock-store": "^1.0.6",
"@typescript-eslint/eslint-plugin": "^7.0.1",
"@typescript-eslint/parser": "^7.0.1",
"@typescript-eslint/eslint-plugin": "^7.4.0",
"@typescript-eslint/parser": "^7.4.0",
"@vitejs/plugin-react": "^4.2.1",
"eslint": "^8.56.0",
"@vitest/coverage-v8": "^1.4.0",
"eslint": "^8.57.0",
"eslint-config-prettier": "^9.1.0",
"eslint-import-resolver-typescript": "^3.6.1",
"eslint-plugin-import": "^2.29.1",
"eslint-plugin-jsx-a11y": "^6.8.0",
"eslint-plugin-react-hooks": "^4.6.0",
"eslint-plugin-react-refresh": "^0.4.5",
"eslint-plugin-react-refresh": "^0.4.6",
"eslint-plugin-storybook": "^0.8.0",
"i18next-parser": "^8.12.0",
"i18next-parser": "^8.13.0",
"identity-obj-proxy": "^3.0.0",
"jest": "^29.7.0",
"jest-environment-jsdom": "^29.7.0",
"jest-svg-transformer": "^1.0.0",
"prettier": "^3.2.5",
"redux-mock-store": "^1.5.4",
"redux-saga-test-plan": "^4.0.6",
"storybook": "^7.6.16",
"storybook-addon-react-router-v6": "^2.0.10",
"storybook-react-i18next": "^2.0.10",
"ts-jest": "^29.1.2",
"typescript": "^5.3.3",
"vite": "^5.1.3",
"vite-tsconfig-paths": "^4.3.1"
},
"jest": {
"preset": "ts-jest",
"testEnvironment": "jsdom",
"moduleNameMapper": {
"^.+\\.svg$": "jest-svg-transformer",
"^.+\\.(css|less|scss|webp|png|jpg)$": "identity-obj-proxy",
"react-i18next": "<rootDir>/src/__mocks__/i18nextMock.tsx",
"@/features/i18n/(.*)": "<rootDir>/src/features/i18n/$1",
"@/features/ui/(.*)": "<rootDir>/src/features/ui/$1",
"@/features/wallet/(.*)": "<rootDir>/src/features/wallet/$1",
"@/services/(.*)": "<rootDir>/src/services/$1",
"@/pages/(.*)": "<rootDir>/src/pages/$1",
"@/hooks/(.*)": "<rootDir>/src/hooks/$1",
"@/store/(.*)": "<rootDir>/src/store/$1"
},
"setupFilesAfterEnv": [
"<rootDir>/src/setupTests.ts"
],
"collectCoverageFrom": [
"src/**/*.{js,jsx,ts,tsx}",
"!src/**/*.stories.{js,jsx,ts,tsx}",
"!<rootDir>/node_modules/",
"!<rootDir>/services/ethersV5"
],
"coveragePathIgnorePatterns": [],
"coverageThreshold": {
"global": {
"branches": 30,
"functions": 30,
"lines": 30,
"statements": 30
}
}
"storybook": "^8.0.4",
"storybook-addon-remix-react-router": "^3.0.0",
"storybook-react-i18next": "^3.0.1",
"typescript": "^5.4.3",
"vite": "^5.2.6",
"vite-tsconfig-paths": "^4.3.2",
"vitest": "^1.4.0"
}
}
1 change: 1 addition & 0 deletions src/features/i18n/translations/en-US/FeatureWallet.json
Original file line number Diff line number Diff line change
Expand Up @@ -38,6 +38,7 @@
"You have successfully signed the login request.": "You have successfully signed the login request.",
"Redirecting to app...": "Redirecting to app...",
"An error has occured during the sign check.": "An error has occured during the sign check.",
"Preparing Sign Request": "Preparing Sign Request",
"Sign Rejected": "Sign Rejected",
"You rejected the sign request.": "You rejected the sign request.",
"Waiting Signature": "Waiting Signature",
Expand Down
1 change: 1 addition & 0 deletions src/features/i18n/translations/tr-TR/FeatureWallet.json
Original file line number Diff line number Diff line change
Expand Up @@ -38,6 +38,7 @@
"You have successfully signed the login request.": "Giriş isteğini başarılı bir şekilde imzaladınız.",
"Redirecting to app...": "Uygulamaya yönleniliyor...",
"An error has occured during the sign check.": "İmza kontrolü sırasında bir hata oluştu.",
"Preparing Sign Request": "İmzalanacak mesaj hazırlanıyor.",
"Sign Rejected": "İmza Reddedildi",
"You rejected the sign request.": "İmza isteğini reddettiniz.",
"Waiting Signature": "İmza Bekleniyor",
Expand Down
6 changes: 3 additions & 3 deletions src/features/i18n/useChangeLanguage.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -4,10 +4,10 @@ import { i18nConfig } from './config';
import { useChangeLanguage } from './useChangeLanguage';

// Mock the navigate function
const mockedUsedNavigate = jest.fn();
const mockedUsedNavigate = vi.fn();

jest.mock('react-router-dom', () => ({
...jest.requireActual('react-router-dom'),
vi.mock('react-router-dom', () => ({
// ...jest.requireActual('react-router-dom'),
useNavigate: () => mockedUsedNavigate,
}));

Expand Down
Original file line number Diff line number Diff line change
@@ -1,11 +1,11 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html

exports[`Feature: UI Component: AlertMessage Scenario: Error should be visible and show error status, title, and children 1`] = `[Function]`;
exports[`Feature: UI > Component: AlertMessage > Scenario: Error > should be visible and show error status, title, and children 1`] = `[Function]`;

exports[`Feature: UI Component: AlertMessage Scenario: Info should be visible and show Info status, title, and children 1`] = `[Function]`;
exports[`Feature: UI > Component: AlertMessage > Scenario: Info > should be visible and show Info status, title, and children 1`] = `[Function]`;

exports[`Feature: UI Component: AlertMessage Scenario: Loading should be visible and show Loading status, title, and children 1`] = `[Function]`;
exports[`Feature: UI > Component: AlertMessage > Scenario: Loading > should be visible and show Loading status, title, and children 1`] = `[Function]`;

exports[`Feature: UI Component: AlertMessage Scenario: Success should be visible and show Success status, title, and children 1`] = `[Function]`;
exports[`Feature: UI > Component: AlertMessage > Scenario: Success > should be visible and show Success status, title, and children 1`] = `[Function]`;

exports[`Feature: UI Component: AlertMessage Scenario: Warning should be visible and show Warning status, title, and children 1`] = `[Function]`;
exports[`Feature: UI > Component: AlertMessage > Scenario: Warning > should be visible and show Warning status, title, and children 1`] = `[Function]`;
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html

exports[`Feature: UI Component: Layout/CookieConsentMessage should render with debug enabled 1`] = `
exports[`Feature: UI > Component: Layout/CookieConsentMessage > should render with debug enabled 1`] = `
<DocumentFragment>
<div
class="CookieConsent"
Expand Down Expand Up @@ -42,7 +42,7 @@ exports[`Feature: UI Component: Layout/CookieConsentMessage should render with d
</DocumentFragment>
`;

exports[`Feature: UI Component: Layout/CookieConsentMessage should render with default props 1`] = `
exports[`Feature: UI > Component: Layout/CookieConsentMessage > should render with default props 1`] = `
<DocumentFragment>
<div
class="CookieConsent"
Expand Down
2 changes: 1 addition & 1 deletion src/features/ui/components/Layout/Copyright/Copyright.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ import reactDappTemplateLogo from '../../../assets/images/react-dapp-template-lo
export const Copyright: React.FC = React.memo(() => {
return (
<Box>
<Tooltip label="Powered by React dApp Template (Vite) v0.5.5">
<Tooltip label="Powered by React dApp Template (Vite) v0.6.0">
<Button
as={Link}
href="https://github.com/huseyindeniz/vite-react-dapp-template"
Expand Down
Original file line number Diff line number Diff line change
@@ -1,3 +1,3 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html

exports[`Feature: UI Component: Layout/ErrorFallback should be visible and show error message 1`] = `[Function]`;
exports[`Feature: UI > Component: Layout/ErrorFallback > should be visible and show error message 1`] = `[Function]`;
8 changes: 4 additions & 4 deletions src/features/ui/components/Layout/Footer/Footer.test.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,19 +2,19 @@ import { render } from '@testing-library/react';

import { Footer } from './Footer';

jest.mock('../Copyright/Copyright', () => ({
vi.mock('../Copyright/Copyright', () => ({
Copyright: () => <div data-testid="mock-copyright" />,
}));

jest.mock('../SecondaryMenu/SecondaryMenu', () => ({
vi.mock('../SecondaryMenu/SecondaryMenu', () => ({
SecondaryMenu: () => <div data-testid="mock-secondary-menu" />,
}));

jest.mock('../SiteLogo/SiteLogo', () => ({
vi.mock('../SiteLogo/SiteLogo', () => ({
SiteLogo: () => <div data-testid="mock-site-logo" />,
}));

jest.mock('../SocialMenu/SocialMenu', () => ({
vi.mock('../SocialMenu/SocialMenu', () => ({
SocialMenu: () => <div data-testid="mock-social-menu" />,
}));

Expand Down
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html

exports[`Feature: UI Component: Layout/Footer/FooterContent Scenario: Default should be visible and show both rows of content 1`] = `[Function]`;
exports[`Feature: UI > Component: Layout/Footer/FooterContent > Scenario: Default > should be visible and show both rows of content 1`] = `[Function]`;

exports[`Feature: UI Component: Layout/Footer/FooterContent Scenario: Only First Row should be visible and show only the first row of content 1`] = `[Function]`;
exports[`Feature: UI > Component: Layout/Footer/FooterContent > Scenario: Only First Row > should be visible and show only the first row of content 1`] = `[Function]`;

exports[`Feature: UI Component: Layout/Footer/FooterContent Scenario: Only Second Row should be visible and show only the second row of content 1`] = `[Function]`;
exports[`Feature: UI > Component: Layout/Footer/FooterContent > Scenario: Only Second Row > should be visible and show only the second row of content 1`] = `[Function]`;
8 changes: 4 additions & 4 deletions src/features/ui/components/Layout/Layout.test.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,21 +3,21 @@ import { MemoryRouter } from 'react-router-dom';

import { Layout } from './Layout';

jest.mock('./Header/Header', () => ({
vi.mock('./Header/Header', () => ({
Header: () => <div data-testid="mock-header">Mock Header</div>,
}));

jest.mock('./Footer/Footer', () => ({
vi.mock('./Footer/Footer', () => ({
Footer: () => <div data-testid="mock-footer">Mock Footer</div>,
}));

jest.mock('./ScrollToTopButton/ScrollToTopButton', () => ({
vi.mock('./ScrollToTopButton/ScrollToTopButton', () => ({
ScrollToTopButton: () => (
<div data-testid="mock-scroll-to-top-button">Mock ScrollToTopButton</div>
),
}));

jest.mock('./CookieConsent/CookieConsentMessage', () => ({
vi.mock('./CookieConsent/CookieConsentMessage', () => ({
CookieConsentMessage: () => (
<div data-testid="mock-cookie-consent">Mock CookieConsent</div>
),
Expand Down
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
// ConnectButton.stories.ts|tsx
import type { Meta, StoryObj } from '@storybook/react';
import { withRouter } from 'storybook-addon-react-router-v6';
import { withRouter } from 'storybook-addon-remix-react-router';

import { MenuType } from '@/pages/types';

Expand Down
Original file line number Diff line number Diff line change
@@ -1,3 +1,3 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html

exports[`Feature: UI Component: Layout/Footer Scenario: Error should render correctly 1`] = `[Function]`;
exports[`Feature: UI > Component: Layout/Footer > Scenario: Error > should render correctly 1`] = `[Function]`;
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ import { render } from '@testing-library/react';

import { ProfileMenu } from './ProfileMenu';

jest.mock('@/features/wallet/components/Wallet', () => ({
vi.mock('@/features/wallet/components/Wallet', () => ({
Wallet: () => <div data-testid="mock-wallet" />,
}));

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -7,10 +7,10 @@ describe.skip('Feature: UI', () => {
it('renders a button when the scroll position is greater than 300 and scrolls to the top of the page when the button is clicked', () => {
// Arrange
const mockWindow = {
addEventListener: jest.fn(),
removeEventListener: jest.fn(),
addEventListener: vi.fn(),
removeEventListener: vi.fn(),
pageYOffset: 400,
scrollTo: jest.fn(),
scrollTo: vi.fn(),
};
(global as any).window = mockWindow;

Expand All @@ -27,8 +27,8 @@ describe.skip('Feature: UI', () => {
it('does not render a button when the scroll position is less than 300', () => {
// Arrange
const mockWindow = {
addEventListener: jest.fn(),
removeEventListener: jest.fn(),
addEventListener: vi.fn(),
removeEventListener: vi.fn(),
pageYOffset: 200,
};
(global as any).window = mockWindow;
Expand All @@ -43,8 +43,8 @@ describe.skip('Feature: UI', () => {
it('removes the scroll event listener when the component unmounts', () => {
// Arrange
const mockWindow = {
addEventListener: jest.fn(),
removeEventListener: jest.fn(),
addEventListener: vi.fn(),
removeEventListener: vi.fn(),
pageYOffset: 400,
};
(global as any).window = mockWindow;
Expand Down
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
// ConnectButton.stories.ts|tsx
import type { Meta, StoryObj } from '@storybook/react';
import { withRouter } from 'storybook-addon-react-router-v6';
import { withRouter } from 'storybook-addon-remix-react-router';

import { MenuType } from '@/pages/types';

Expand Down
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
// ConnectButton.stories.ts|tsx
import type { Meta, StoryObj } from '@storybook/react';
import { withRouter } from 'storybook-addon-react-router-v6';
import { withRouter } from 'storybook-addon-remix-react-router';

import { SiteLogo } from './SiteLogo';

Expand Down
Loading

0 comments on commit d9cb837

Please sign in to comment.