Skip to content

Commit

Permalink
Merge branch 'niloo/84471/ts-migration-parent' of github.com:niloofar…
Browse files Browse the repository at this point in the history
…-deriv/deriv-app into suisin/74185/ts_migration_self_exclusion_modal
  • Loading branch information
suisin-deriv committed Jan 18, 2023
2 parents 51427cf + 0360500 commit 3fad336
Show file tree
Hide file tree
Showing 80 changed files with 1,589 additions and 1,506 deletions.
13 changes: 13 additions & 0 deletions .github/lighthouse/lighthouserc.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
{
"ci": {
"assert": {
"assertions": {
"categories:performance": ["warn", { "minScore": 0.5 }],
"categories:accessibility": ["warn", { "minScore": 0.5 }],
"categories:best-practices": ["warn", { "minScore": 0.5 }],
"categories:seo": ["warn", { "minScore": 0.5 }],
"categories:pwa": ["warn", { "minScore": 0.5 }]
}
}
}
}
85 changes: 85 additions & 0 deletions .github/workflows/lighthouse.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,85 @@
name: Generate Lighthouse report

on:
issue_comment:
types: [edited]

jobs:
generate_lighthouse_report:
timeout-minutes: 30
runs-on: ubuntu-latest
steps:
- name: Checkout to repo
uses: actions/checkout@v3
with:
fetch-depth: 1
ref: master

- name: Add Lighthouse progress comment
id: generate_lighthouse_comment
uses: marocchino/sticky-pull-request-comment@v2
with:
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
number: ${{github.event.issue.number}}
header: generate_lighthouse_comment
message: "⏳ **Generating Lighthouse report...**"

- name: Capture Vercel preview URL
id: vercel_preview_url
uses: binary-com/vercel-preview-url-action@v1.0.5
with:
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

- name: Generate Lighthouse report
uses: treosh/lighthouse-ci-action@v9
id: lighthouse_report
with:
temporaryPublicStorage: true
urls: |
${{ steps.vercel_preview_url.outputs.vercel_preview_url }}
uploadArtifacts: true
# configure Lighthouse score assertions in this file
# configPath: .github/lighthouse/lighthouserc.json

- name: Retrieve Lighthouse score
id: lighthouse_score
uses: actions/github-script@v3
with:
github-token: ${{secrets.GITHUB_TOKEN}}
script: |
const result = ${{ steps.lighthouse_report.outputs.manifest }}[0].summary
const links = ${{ steps.lighthouse_report.outputs.links }}
const score = res => res >= 90 ? '🟢' : res >= 50 ? '🟧' : '🔺'
const formatResult = (res) => Math.round((res * 100))
Object.keys(result).forEach(key => result[key] = formatResult(result[key]))
const comment = [
`🚨 [Lighthouse report](${Object.values(links)[0]}) for the changes in this PR:`,
'| Category | Score |',
'| --- | --- |',
`| ${score(result.performance)} Performance | ${result.performance} |`,
`| ${score(result.accessibility)} Accessibility | ${result.accessibility} |`,
`| ${score(result['best-practices'])} Best practices | ${result['best-practices']} |`,
`| ${score(result.seo)} SEO | ${result.seo} |`,
`| ${score(result.pwa)} PWA | ${result.pwa} |`,
' ',
`*Lighthouse ran with [${Object.keys(links)[0]}](${Object.keys(links)[0]})*`
].join('\n')
core.setOutput("comment", comment);
- name: Post Lighthouse report
uses: marocchino/sticky-pull-request-comment@v2
with:
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
header: Lighthouse report
number: ${{github.event.issue.number}}
message: ${{steps.lighthouse_score.outputs.comment}}

- name: Clear Lighthouse progress comment
uses: marocchino/sticky-pull-request-comment@v2
with:
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
number: ${{github.event.issue.number}}
header: generate_lighthouse_comment
delete: true
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ import { BrowserRouter } from 'react-router-dom';
jest.mock('Stores/connect.js', () => ({
__esModule: true,
default: 'mockedDefaultExport',
connect: () => Component => Component,
connect: () => (Component: React.ReactElement) => Component,
}));

jest.mock('@deriv/components', () => {
Expand All @@ -31,11 +31,12 @@ jest.mock('Components/load-error-message', () => jest.fn(() => 'mockedLoadErrorM
jest.mock('../account-limits-footer', () => jest.fn(() => 'mockedAccountLimitsFooter'));

describe('<AccountLimits/>', () => {
const props = {
const props: React.ComponentProps<typeof AccountLimits> = {
currency: 'AUD',
is_fully_authenticated: true,
is_switching: false,
is_virtual: false,
overlay_ref: document.createElement('div'),
getLimits: jest.fn(() => Promise.resolve({ data: {} })),
account_limits: {
account_balance: 300000,
Expand Down Expand Up @@ -66,9 +67,9 @@ describe('<AccountLimits/>', () => {
cryptocurrency: [
{
name: 'Cryptocurrencies',
payout_limit: '100.00',
payout_limit: 100.0,
profile_name: 'extreme_risk',
turnover_limit: '1000.00',
turnover_limit: 1000.0,
},
],
forex: [
Expand Down Expand Up @@ -124,15 +125,31 @@ describe('<AccountLimits/>', () => {
});

it('should render DemoMessage component if is_virtual is true', () => {
const { container } = render(<AccountLimits {...props} is_virtual />);
expect(container.firstChild).toHaveClass('account__demo-message-wrapper');

render(<AccountLimits {...props} is_virtual />);
expect(screen.queryByTestId('dt_account_demo_message_wrapper')).toHaveClass('account__demo-message-wrapper');
expect(screen.getByText('mockedDemoMessage')).toBeInTheDocument();
});

it('should render LoadErrorMessage component if there is api_initial_load_error', () => {
render(
<AccountLimits {...props} account_limits={{ api_initial_load_error: 'error in fetching data from API' }} />
<AccountLimits
{...props}
account_limits={{
api_initial_load_error: 'error in fetching data from API',
account_balance: '',
payout: '',
market_specific: {
commodities: [],
cryptocurrency: [],
forex: [],
indices: [],
synthetic_index: [],
},
num_of_days_limit: '',
remainder: '',
withdrawal_since_inception_monetary: '',
}}
/>
);
expect(screen.getByText('mockedLoadErrorMessage')).toBeInTheDocument();
});
Expand All @@ -153,8 +170,8 @@ describe('<AccountLimits/>', () => {
});

it('should render AccountLimitsArticle component if should_show_article is true and is_from_derivgo is false in mobile mode', () => {
isMobile.mockReturnValue(true);
isDesktop.mockReturnValue(false);
(isMobile as jest.Mock).mockReturnValue(true);
(isDesktop as jest.Mock).mockReturnValue(false);
render(<AccountLimits {...props} should_show_article />);
expect(screen.getByRole('heading', { name: /account limits/i })).toBeInTheDocument();
expect(
Expand All @@ -163,8 +180,8 @@ describe('<AccountLimits/>', () => {
});

it('should render AccountLimitsArticle component if should_show_article is true and is_from_derivgo is true in mobile mode', () => {
isMobile.mockReturnValue(true);
isDesktop.mockReturnValue(false);
(isMobile as jest.Mock).mockReturnValue(true);
(isDesktop as jest.Mock).mockReturnValue(false);
render(<AccountLimits {...props} should_show_article is_from_derivgo />);
expect(screen.getByRole('heading', { name: /account limits/i })).toBeInTheDocument();
expect(
Expand All @@ -173,8 +190,8 @@ describe('<AccountLimits/>', () => {
});

it('should not render AccountLimitsArticle component if should_show_article is false', () => {
isMobile.mockReturnValue(true);
isDesktop.mockReturnValue(false);
(isMobile as jest.Mock).mockReturnValue(true);
(isDesktop as jest.Mock).mockReturnValue(false);
render(<AccountLimits {...props} should_show_article={false} />);
expect(screen.queryByText('/account limits/i')).not.toBeInTheDocument();
});
Expand Down Expand Up @@ -210,7 +227,7 @@ describe('<AccountLimits/>', () => {
const { open_positions } = props.account_limits;
expect(
screen.getByRole('cell', {
name: open_positions,
name: open_positions?.toString(),
})
).toBeInTheDocument();
});
Expand Down Expand Up @@ -300,13 +317,10 @@ describe('<AccountLimits/>', () => {
</PlatformContext.Provider>
);
expect(screen.getByText(/to increase limit please verify your identity/i)).toBeInTheDocument();

expect(
screen
.getByRole('link', {
name: /verify/i,
})
.closest('a')
screen.getByRole('link', {
name: /verify/i,
})
).toHaveAttribute('href', '/account/proof-of-identity');
const { num_of_days_limit } = props.account_limits;
expect(formatMoney).toHaveBeenCalledWith(props.currency, num_of_days_limit, true);
Expand All @@ -330,8 +344,8 @@ describe('<AccountLimits/>', () => {
});

it('should show limit_notice message when is_appstore is true and is_fully_authenticated is false in mobile mode', () => {
isDesktop.mockReturnValue(false);
isMobile.mockReturnValue(true);
(isMobile as jest.Mock).mockReturnValue(true);
(isDesktop as jest.Mock).mockReturnValue(false);
render(
<PlatformContext.Provider value={{ is_appstore: true }}>
<BrowserRouter>
Expand All @@ -343,8 +357,8 @@ describe('<AccountLimits/>', () => {
});

it('should not show limit_notice message when is_appstore is false and is_fully_authenticated is false', () => {
isDesktop.mockReturnValue(true);
isMobile.mockReturnValue(false);
(isMobile as jest.Mock).mockReturnValue(false);
(isDesktop as jest.Mock).mockReturnValue(true);
render(
<PlatformContext.Provider value={{ is_appstore: false }}>
<BrowserRouter>
Expand All @@ -358,25 +372,24 @@ describe('<AccountLimits/>', () => {
});

it('should show AccountLimitsArticle when should_show_article and isDesktop is true', () => {
isDesktop.mockReturnValue(true);
isMobile.mockReturnValue(false);
(isMobile as jest.Mock).mockReturnValue(false);
(isDesktop as jest.Mock).mockReturnValue(true);
render(<AccountLimits {...props} should_show_article />);
expect(screen.getByRole('heading', { name: /account limits/i })).toBeInTheDocument();
expect(screen.getByText(/these are default limits that we apply to your accounts\./i)).toBeInTheDocument();
expect(
screen.getByText(/to learn more about trading limits and how they apply, please go to the/i)
).toBeInTheDocument();
expect(
screen
.getByRole('link', {
name: /help centre/i,
})
.closest('a')
screen.getByRole('link', {
name: /help centre/i,
})
).toHaveAttribute('href', 'https://deriv.com/help-centre/trading/#trading-limits');
});

it('should show AccountLimitsFooter if footer_ref is passed', () => {
const footer = { current: { offsetWidth: 100 } };
const footer = React.createRef<HTMLElement>();

render(<AccountLimits {...props} should_show_article footer_ref={footer} />);
expect(screen.getByText(/mockedaccountlimitsfooter/i)).toBeInTheDocument();
});
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -3,17 +3,17 @@ import { formatMoney } from '@deriv/shared';
import AccountLimitsTableCell from './account-limits-table-cell';
import AccountLimitsContext, { TAccountLimitsContext } from './account-limits-context';

type TAccountLimits = {
level: string;
export type TAccountLimitsCollection = {
level?: string;
name: string;
payout_limit: number;
profile_name: string;
turnover_limit: number;
};

type TAccountLimitsTurnoverLimitRow = {
collection: TAccountLimits[];
title: string;
collection: TAccountLimitsCollection[];
title?: string;
};

const AccountLimitsTurnoverLimitRow = ({ collection, title }: TAccountLimitsTurnoverLimitRow) => {
Expand Down
Loading

0 comments on commit 3fad336

Please sign in to comment.