Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 4 additions & 0 deletions .storybook/webpack.config.js
Original file line number Diff line number Diff line change
@@ -1,7 +1,11 @@
const defaultConfig = require('@stoplight/storybook-config/webpack.config');
const path = require('path');

module.exports = (baseConfig, env, config) => {
config = defaultConfig(baseConfig, env, config);

config.output.globalObject = 'this';
config.resolve.alias['web-worker:../workers/schema.ts'] = path.join(process.cwd(), './src/__stories__/worker.shim.ts');

return config;
};
3 changes: 3 additions & 0 deletions babel.config.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
module.exports = {
'plugins': ['@babel/plugin-transform-modules-commonjs'],
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

can you write a paragraph explaining why we need to add Babel to the ever-growing-list-of-compilers we need to support? Looks like it's only used by Jest?

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

hang on I just realized this isn't studio-internal 😆 um... I'm still curious though

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It's because of of lodash-es. I suspect I should be able to instrument TS to transpile those files, though, so will give it a try.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I see we replaced lodash - what is lodash-es doing for us?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Rollup does not really like CJS modules, so this is the primary reason.
Lodash-es is mostly used in a worker code, so it does not really change much now.

};
27 changes: 21 additions & 6 deletions jest.config.js
Original file line number Diff line number Diff line change
@@ -1,9 +1,24 @@
module.exports = {
preset: "@stoplight/scripts",
testEnvironment: "jsdom",
setupFilesAfterEnv: ["./setupTests.ts"],
snapshotSerializers: ["enzyme-to-json/serializer"],
rootDir: process.cwd(),
testEnvironment: 'jsdom',
setupFilesAfterEnv: ['./setupTests.ts'],
moduleNameMapper: {
"\\.(css)$": "<rootDir>/__mocks__/styleMock.js"
}
'\\.css$': '<rootDir>/__mocks__/styleMock.js',
'web-worker:\\.\\./(.+)$': '<rootDir>/src/$1'
},
testMatch: ['<rootDir>/src/**/__tests__/*.(ts|js)?(x)'],
transformIgnorePatterns: ['/node_modules/(?!lodash-es)/'],
transform: {
'\\.tsx?$': 'ts-jest',
'^.+\\.js$': 'babel-jest'
},
coveragePathIgnorePatterns: ['/node_modules/', '/__tests__/', '/__stories__/', '__mocks__/', 'types.ts'],
collectCoverageFrom: ['src/**/*.{ts,tsx}'],
globals: {
'ts-jest': {
diagnostics: {
ignoreCodes: [151001],
},
},
},
};
71 changes: 40 additions & 31 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -20,10 +20,10 @@
"node": ">=8.3.0"
},
"scripts": {
"build": "sl-scripts build",
"build": "sl-scripts build --sourcemap",
"build.docs": "build-storybook -c .storybook -o docs-auto",
"commit": "git-cz",
"lint": "tslint -c tslint.json 'src/**/*.ts?'",
"lint": "tslint -c tslint.json -p tsconfig.json 'src/**/*.ts?'",
"lint.fix": "yarn lint --fix",
"release": "sl-scripts release",
"release.docs": "sl-scripts release:docs",
Expand All @@ -38,48 +38,57 @@
"@stoplight/markdown-viewer": "3.x.x",
"@stoplight/tree-list": "4.x.x",
"@stoplight/ui-kit": "2.x.x",
"lodash": "4.x.x",
"mobx": "5.x.x",
"react": ">=16.8",
"react-dom": ">=16.8"
},
"dependencies": {
"@stoplight/json": "1.9.x",
"@stoplight/json": "3.0.3",
"classnames": "^2.2.6",
"json-schema-merge-allof": "https://github.com/stoplightio/json-schema-merge-allof",
"mobx-react-lite": "^1.3.1",
"pluralize": "^7.0.0"
"lodash-es": "^4.17.15",
"mobx-react-lite": "^1.4.1",
"pluralize": "^8.0.0"
},
"devDependencies": {
"@sambego/storybook-state": "^1.3.4",
"@stoplight/markdown-viewer": "^3.0.0",
"@stoplight/scripts": "5.1.0",
"@stoplight/storybook-config": "^2.0.2",
"@stoplight/tree-list": "^4.0.0",
"@stoplight/types": "4.1.0",
"@stoplight/ui-kit": "^2.4.0",
"@types/classnames": "^2.2.7",
"@types/enzyme": "3.9.1",
"@types/jest": "^24.0.12",
"@babel/plugin-transform-modules-commonjs": "^7.5.0",
"@emotion/core": "^10.0.16",
"@emotion/styled": "^10.0.15",
"@sambego/storybook-state": "^1.3.6",
"@stoplight/markdown-viewer": "^3.5.5",
"@stoplight/scripts": "7.0.3",
"@stoplight/storybook-config": "^2.0.4",
"@stoplight/tree-list": "^4.8.0",
"@stoplight/types": "11.0.0",
"@stoplight/ui-kit": "^2.10.0",
"@types/classnames": "^2.2.9",
"@types/enzyme": "3.10.3",
"@types/jest": "^24.0.18",
"@types/json-schema": "^7.0.3",
"@types/node": "^11.13.8",
"@types/lodash-es": "^4.17.3",
"@types/node": "^12.7.2",
"@types/pluralize": "^0.0.29",
"@types/react": "16.8.12",
"@types/react-dom": "16.8.3",
"copyfiles": "^2.1.0",
"enzyme": "3.9.0",
"enzyme-adapter-react-16": "1.12.1",
"enzyme-to-json": "3.x.x",
"jest": "^24.7.1",
"jest-enzyme": "7.0.2",
"lodash": "^4.17.11",
"mobx": "^5.9.4",
"react": "16.8.6",
"react-dom": "16.8.6",
"@types/react": "16.9.2",
"@types/react-dom": "16.9.0",
"babel-jest": "^24.9.0",
"copyfiles": "^2.1.1",
"emotion-theming": "^10.0.14",
"enzyme": "3.10.0",
"enzyme-adapter-react-16": "1.14.0",
"enzyme-to-json": "3.4.0",
"jest": "^24.9.0",
"jest-enzyme": "7.1.0",
"mobx": "^5.13.0",
"react": "16.9.0",
"react-dom": "16.9.0",
"rollup-plugin-commonjs": "^10.0.2",
"rollup-plugin-node-resolve": "^5.2.0",
"rollup-plugin-web-worker-loader": "p0lip/rollup-plugin-web-worker-loader",
"ts-jest": "^24.0.2",
"tslint": "^5.16.0",
"tslint": "^5.19.0",
"tslint-config-stoplight": "^1.2.0",
"typescript": "3.4.5"
"typescript": "3.5.3",
"worker-loader": "^2.0.0"
},
"lint-staged": {
"*.{ts,tsx}$": [
Expand Down
16 changes: 16 additions & 0 deletions rollup.config.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
import config from '@stoplight/scripts/rollup.config';
import webWorkerLoader from 'rollup-plugin-web-worker-loader';
import resolve from 'rollup-plugin-node-resolve';
import commonjs from 'rollup-plugin-commonjs';

config.plugins.push(
commonjs(),
resolve({
only: ['json-schema-merge-allof', /lodash(?:-es)?\/?.*/],
}),
webWorkerLoader({
inline: true,
}),
);

export default config;
51 changes: 33 additions & 18 deletions src/__stories__/JsonSchemaViewer.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -6,15 +6,14 @@ import { action } from '@storybook/addon-actions';
import { boolean, number, object, select, text, withKnobs } from '@storybook/addon-knobs';
import { storiesOf } from '@storybook/react';
import { JSONSchema4 } from 'json-schema';
import { JsonSchemaViewer, SchemaRow } from '../components';
import { JsonSchemaViewer, RowRenderer, SchemaRow } from '../';

import * as allOfSchemaResolved from '../__fixtures__/allOf/allOf-resolved.json';
import * as allOfSchema from '../__fixtures__/allOf/allOf-schema.json';
import * as schema from '../__fixtures__/default-schema.json';
import * as schemaWithRefs from '../__fixtures__/ref/original.json';
import * as dereferencedSchema from '../__fixtures__/ref/resolved.json';
import * as stressSchema from '../__fixtures__/stress-schema.json';
import { RowRenderer } from '../types';
const allOfSchemaResolved = require('../__fixtures__/allOf/allOf-resolved.json');
const allOfSchema = require('../__fixtures__/allOf/allOf-schema.json');
const schema = require('../__fixtures__/default-schema.json');
const schemaWithRefs = require('../__fixtures__/ref/original.json');
const dereferencedSchema = require('../__fixtures__/ref/resolved.json');
const stressSchema = require('../__fixtures__/stress-schema.json');
import { Wrapper } from './utils/Wrapper';

storiesOf('JsonSchemaViewer', module)
Expand Down Expand Up @@ -88,16 +87,32 @@ storiesOf('JsonSchemaViewer', module)
);
})
.add('stress-test schema', () => (
<JsonSchemaViewer
name={text('name', 'my stress schema')}
schema={stressSchema as JSONSchema4}
defaultExpandedDepth={number('defaultExpandedDepth', 2)}
expanded={boolean('expanded', false)}
hideTopBar={boolean('hideTopBar', false)}
onGoToRef={action('onGoToRef')}
maxRows={number('maxRows', 10)}
mergeAllOf={boolean('mergeAllOf', true)}
/>
<>
<div style={{ height: 345 }}>
<JsonSchemaViewer
name={text('name', 'my stress schema')}
schema={stressSchema as JSONSchema4}
defaultExpandedDepth={number('defaultExpandedDepth', 2)}
expanded={boolean('expanded', false)}
hideTopBar={boolean('hideTopBar', false)}
onGoToRef={action('onGoToRef')}
maxRows={number('maxRows', 10)}
mergeAllOf={boolean('mergeAllOf', true)}
/>
</div>
<div style={{ height: 345 }}>
<JsonSchemaViewer
name={text('name', 'my stress schema 2')}
schema={stressSchema as JSONSchema4}
defaultExpandedDepth={number('defaultExpandedDepth', 2)}
expanded={boolean('expanded', false)}
hideTopBar={boolean('hideTopBar', false)}
onGoToRef={action('onGoToRef')}
maxRows={number('maxRows', 10)}
mergeAllOf={boolean('mergeAllOf', true)}
/>
</div>
</>
))
.add('allOf-schema', () => (
<JsonSchemaViewer
Expand Down
3 changes: 3 additions & 0 deletions src/__stories__/worker.shim.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
import Worker from 'worker-loader!../workers/schema.ts';

export default Worker;
Loading