Skip to content

Commit 97e8448

Browse files
juanpicadojuanpicado
authored
fix: refactoring version page / fix issue not found page conventional-changelog#100 (conventional-changelog#117)
* chore: refactoring version page * refactor: migrate version page to hooks * refactor: Version page better imports * fix: conventional-changelog#100 render not found on click item * test: add test for version page * chore: update mocks * test: add scenario for not found package * chore: fix wrong mock path * chore: update mock * chore: add todo list
1 parent e7d3c46 commit 97e8448

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

42 files changed

+25184
-676
lines changed

‎jest.config.js

-36
This file was deleted.

‎jest/jest.config.js

+1
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ const { defaults } = require('jest-config');
33
module.exports = {
44
name: 'verdaccio-ui-jest',
55
verbose: true,
6+
automock: false,
67
collectCoverage: true,
78
testEnvironment: 'jest-environment-jsdom-global',
89
moduleFileExtensions: [...defaults.moduleFileExtensions, 'ts', 'tsx'],

‎jest/setup.ts

+5
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@
55
import 'raf/polyfill';
66
import { configure } from 'enzyme';
77
import Adapter from 'enzyme-adapter-react-16';
8+
import { GlobalWithFetchMock } from 'jest-fetch-mock';
89

910
// @ts-ignore : Only a void function can be called with the 'new' keyword
1011
configure({ adapter: new Adapter() });
@@ -14,6 +15,10 @@ global.__APP_VERSION__ = '1.0.0';
1415
// @ts-ignore : Property '__VERDACCIO_BASENAME_UI_OPTIONS' does not exist on type 'Global'.
1516
global.__VERDACCIO_BASENAME_UI_OPTIONS = {};
1617

18+
const customGlobal: GlobalWithFetchMock = global as GlobalWithFetchMock;
19+
customGlobal.fetch = require('jest-fetch-mock');
20+
customGlobal.fetchMock = customGlobal.fetch;
21+
1722
// mocking few DOM methods
1823
// @ts-ignore : Property 'document' does not exist on type 'Global'.
1924
if (global.document) {

‎package.json

+17-15
Original file line numberDiff line numberDiff line change
@@ -16,24 +16,25 @@
1616
"@material-ui/core": "3.9.3",
1717
"@material-ui/icons": "3.0.2",
1818
"@octokit/rest": "16.28.7",
19-
"@testing-library/react": "9.1.0",
19+
"@testing-library/react": "9.1.3",
2020
"@types/enzyme": "3.10.3",
21-
"@types/lodash": "4.14.136",
21+
"@types/jest": "24.0.18",
22+
"@types/lodash": "4.14.137",
2223
"@types/material-ui": "0.21.6",
23-
"@types/node": "12.7.1",
24-
"@types/react": "16.9.1",
25-
"@types/react-dom": "16.8.5",
26-
"@types/react-router-dom": "4.3.4",
27-
"@types/validator": "10.11.2",
24+
"@types/node": "12.7.2",
25+
"@types/react": "16.9.2",
26+
"@types/react-dom": "16.9.0",
27+
"@types/react-router-dom": "4.3.5",
28+
"@types/validator": "10.11.3",
2829
"@verdaccio/babel-preset": "2.0.0",
2930
"@verdaccio/eslint-config": "2.0.0",
30-
"@verdaccio/types": "8.0.0-next.2",
31+
"@verdaccio/types": "8.0.0",
3132
"autosuggest-highlight": "3.1.1",
3233
"babel-loader": "8.0.6",
3334
"bundlesize": "0.18.0",
3435
"codeceptjs": "2.2.1",
3536
"codecov": "3.5.0",
36-
"concurrently": "4.1.1",
37+
"concurrently": "4.1.2",
3738
"cross-env": "5.2.0",
3839
"css-loader": "3.2.0",
3940
"date-fns": "1.30.1",
@@ -56,11 +57,12 @@
5657
"husky": "3.0.3",
5758
"identity-obj-proxy": "3.0.0",
5859
"in-publish": "2.0.0",
59-
"jest": "24.8.0",
60+
"jest": "24.9.0",
6061
"jest-emotion": "10.0.14",
61-
"jest-environment-jsdom": "24.8.0",
62+
"jest-environment-jsdom": "24.9.0",
6263
"jest-environment-jsdom-global": "1.2.0",
63-
"jest-environment-node": "24.8.0",
64+
"jest-environment-node": "24.9.0",
65+
"jest-fetch-mock": "2.1.2",
6466
"js-base64": "2.5.1",
6567
"js-yaml": "3.13.1",
6668
"localstorage-memory": "1.0.3",
@@ -76,7 +78,7 @@
7678
"react-autosuggest": "9.4.3",
7779
"react-dom": "16.9.0",
7880
"react-emotion": "9.2.12",
79-
"react-hot-loader": "4.12.10",
81+
"react-hot-loader": "4.12.11",
8082
"react-router": "5.0.1",
8183
"react-router-dom": "5.0.1",
8284
"resolve-url-loader": "3.1.0",
@@ -98,10 +100,10 @@
98100
"verdaccio": "4.2.1",
99101
"verdaccio-auth-memory": "1.1.5",
100102
"verdaccio-memory": "2.0.0",
101-
"webpack": "4.39.1",
103+
"webpack": "4.39.2",
102104
"webpack-bundle-analyzer": "3.4.1",
103105
"webpack-bundle-size-analyzer": "3.0.0",
104-
"webpack-cli": "3.3.6",
106+
"webpack-cli": "3.3.7",
105107
"webpack-dev-server": "3.8.0",
106108
"webpack-merge": "4.2.1",
107109
"whatwg-fetch": "3.0.0",

‎src/App/AppError.tsx

+38
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
import React, { Component } from 'react';
2+
3+
export interface ErrorProps {
4+
children: any;
5+
}
6+
7+
export interface ErrorAppState {
8+
hasError: boolean;
9+
error: any;
10+
info: any;
11+
}
12+
13+
export default class ErrorBoundary extends Component<ErrorProps, ErrorAppState> {
14+
constructor(props) {
15+
super(props);
16+
this.state = { hasError: false, error: null, info: null };
17+
}
18+
19+
componentDidCatch(error, info) {
20+
this.setState({ hasError: true, error, info });
21+
}
22+
23+
render() {
24+
const { hasError, error, info } = this.state;
25+
const { children } = this.props;
26+
27+
if (hasError) {
28+
return (
29+
<>
30+
<h1>{'Something went wrong.'}</h1>
31+
<p>{`error: ${error}`}</p>
32+
<p>{`info: ${JSON.stringify(info)}`}</p>
33+
</>
34+
);
35+
}
36+
return children;
37+
}
38+
}

‎src/components/ActionBar/ActionBar.test.tsx

+3-3
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ describe('<ActionBar /> component', () => {
1919
},
2020
};
2121

22-
jest.doMock('../../pages/version/Version', () => ({
22+
jest.doMock('../../pages/Version', () => ({
2323
DetailContextConsumer: component => {
2424
return component.children({ packageMeta });
2525
},
@@ -35,7 +35,7 @@ describe('<ActionBar /> component', () => {
3535
latest: {},
3636
};
3737

38-
jest.doMock('../../pages/version/Version', () => ({
38+
jest.doMock('../../pages/Version', () => ({
3939
DetailContextConsumer: component => {
4040
return component.children({ packageMeta });
4141
},
@@ -57,7 +57,7 @@ describe('<ActionBar /> component', () => {
5757
},
5858
};
5959

60-
jest.doMock('../../pages/version/Version', () => ({
60+
jest.doMock('../../pages/Version', () => ({
6161
DetailContextConsumer: component => {
6262
return component.children({ packageMeta });
6363
},

‎src/components/ActionBar/ActionBar.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ import HomeIcon from '@material-ui/icons/Home';
66
import List from '@material-ui/core/List';
77
import Tooltip from '@material-ui/core/Tooltip';
88

9-
import { DetailContextConsumer, VersionPageConsumerProps } from '../../pages/version/Version';
9+
import { DetailContextConsumer, VersionPageConsumerProps } from '../../pages/Version';
1010
import { Fab, ActionListItem } from './styles';
1111
import { isURL, extractFileName, downloadFile } from '../../utils/url';
1212
import api from '../../utils/api';

‎src/components/Author/Author.test.tsx

+3-3
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ describe('<Author /> component', () => {
2020
},
2121
};
2222

23-
jest.doMock('../../pages/version/Version', () => ({
23+
jest.doMock('../../pages/Version', () => ({
2424
DetailContextConsumer: component => {
2525
return component.children({ packageMeta });
2626
},
@@ -39,7 +39,7 @@ describe('<Author /> component', () => {
3939
},
4040
};
4141

42-
jest.doMock('../../pages/version/Version', () => ({
42+
jest.doMock('../../pages/Version', () => ({
4343
DetailContextConsumer: component => {
4444
return component.children({ packageMeta });
4545
},
@@ -63,7 +63,7 @@ describe('<Author /> component', () => {
6363
},
6464
};
6565

66-
jest.doMock('../../pages/version/Version', () => ({
66+
jest.doMock('../../pages/Version', () => ({
6767
DetailContextConsumer: component => {
6868
return component.children({ packageMeta });
6969
},

‎src/components/Author/Author.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import Avatar from '@material-ui/core/Avatar';
44
import List from '@material-ui/core/List';
55
import ListItemText from '@material-ui/core/ListItemText';
66

7-
import { DetailContextConsumer } from '../../pages/version/Version';
7+
import { DetailContextConsumer } from '../../pages/Version';
88
import { Heading, AuthorListItem } from './styles';
99
import { isEmail } from '../../utils/url';
1010

‎src/components/Dependencies/Dependencies.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import React, { Component, Fragment, ReactElement } from 'react';
22
import { withRouter, RouteComponentProps } from 'react-router-dom';
33
import CardContent from '@material-ui/core/CardContent';
44

5-
import { DetailContextConsumer, VersionPageConsumerProps } from '../../pages/version/Version';
5+
import { DetailContextConsumer, VersionPageConsumerProps } from '../../pages/Version';
66

77
import { CardWrap, Heading, Tags, Tag } from './styles';
88
import NoItems from '../NoItems';

‎src/components/DetailContainer/DetailContainer.tsx

+10-5
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import React, { Component, ReactElement, Fragment } from 'react';
22

3-
import { DetailContextConsumer, VersionPageConsumerProps } from '../../pages/version/Version';
3+
import { DetailContextConsumer, VersionPageConsumerProps } from '../../pages/Version';
44
import Readme from '../Readme';
55
import Versions from '../Versions';
66
import { preventXSS } from '../../utils/sec-utils';
@@ -14,6 +14,11 @@ interface DetailContainerState {
1414
tabPosition: number;
1515
}
1616

17+
export const README_LABEL = 'Readme';
18+
export const DEPS_LABEL = 'Dependencies';
19+
export const VERSION_LABEL = 'Versions';
20+
export const UPLINKS_LABEL = 'Uplinks';
21+
1722
class DetailContainer<P> extends Component<P, DetailContainerState> {
1823
public state = {
1924
tabPosition: 0,
@@ -37,10 +42,10 @@ class DetailContainer<P> extends Component<P, DetailContainerState> {
3742
private renderListTabs(tabPosition: number): React.ReactElement<HTMLElement> {
3843
return (
3944
<Tabs indicatorColor={'primary'} onChange={this.handleChange} textColor={'primary'} value={tabPosition} variant={'fullWidth'}>
40-
<Tab id={'readme-tab'} label={'Readme'} />
41-
<Tab id={'dependencies-tab'} label={'Dependencies'} />
42-
<Tab id={'versions-tab'} label={'Versions'} />
43-
<Tab id={'uplinks-tab'} label={'Uplinks'} />
45+
<Tab data-testid={'readme-tab'} id={'readme-tab'} label={README_LABEL} />
46+
<Tab data-testid={'dependencies-tab'} id={'dependencies-tab'} label={DEPS_LABEL} />
47+
<Tab data-testid={'versions-tab'} id={'versions-tab'} label={VERSION_LABEL} />
48+
<Tab data-testid={'uplinks-tab'} id={'uplinks-tab'} label={UPLINKS_LABEL} />
4449
</Tabs>
4550
);
4651
}

0 commit comments

Comments
 (0)