diff --git a/.eslintignore b/.eslintignore index a6537f53305..3aa5dc37e08 100644 --- a/.eslintignore +++ b/.eslintignore @@ -12,6 +12,7 @@ # # Now un-ignore source code, tests, configuration, etc !/packages/*/src/** +!/packages/*/cypress/** !/packages/*/test/** !/packages/codemirror-graphql/resources/** !/packages/examples/** @@ -31,6 +32,7 @@ # Build artifacts **/flow-typed **/dist +**/renderExample.js # Vendored files /packages/codemirror-graphql/ diff --git a/.eslintrc.js b/.eslintrc.js index 56f73ffe67a..8c7ead336db 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -20,6 +20,11 @@ module.exports = { experimentalObjectRestSpread: true, }, }, + settings: { + 'react': { + 'version': 'detect' + } + }, // https://github.com/sindresorhus/globals/blob/master/globals.json env: { atomtest: true, @@ -28,9 +33,10 @@ module.exports = { jest: true, mocha: true, browser: true, + 'cypress/globals': true }, - extends: ['prettier', 'plugin:import/typescript'], + extends: ['prettier', 'plugin:import/typescript', 'plugin:react/recommended'], globals: { atom: false, @@ -286,7 +292,7 @@ module.exports = { 'prefer-object-spread/prefer-object-spread': 1, }, - plugins: ['babel', 'import', 'flowtype', 'prefer-object-spread'], + plugins: ['babel', 'import', 'flowtype', 'prefer-object-spread', 'cypress'], overrides: [ // Rules for TypeScript only diff --git a/.npmignore b/.npmignore index 51297667274..69f4b51e8b5 100644 --- a/.npmignore +++ b/.npmignore @@ -14,3 +14,6 @@ coverage resources src packages +packages/graphiql/*.html +cypress.json +babel.config.js diff --git a/babel.config.js b/babel.config.js index 9a5a04de22a..5646fbbd7ff 100644 --- a/babel.config.js +++ b/babel.config.js @@ -5,5 +5,8 @@ module.exports = { require.resolve('@babel/preset-flow'), require.resolve('@babel/preset-react'), ], - plugins: [require.resolve('@babel/plugin-proposal-class-properties')], + plugins: [ + require.resolve('@babel/plugin-proposal-class-properties'), + require.resolve('@babel/plugin-syntax-dynamic-import'), + ], }; diff --git a/netlify.toml b/netlify.toml index 077fab7f254..b91bf4aa6bd 100644 --- a/netlify.toml +++ b/netlify.toml @@ -1,3 +1,3 @@ [build] command = "yarn && yarn build && lerna run build-demo" - publish = "packages/examples/graphiql-cdn" + publish = "packages/graphiql" diff --git a/package.json b/package.json index 95dcdbe2a40..6d2afcc2dd1 100644 --- a/package.json +++ b/package.json @@ -19,28 +19,32 @@ } }, "scripts": { - "build": "tsc --build && lerna run build --scope codemirror-graphql --scope graphiql --scope graphql-language-service --scope graphql-language-service-server", + "build": "yarn run build-clean && yarn build-ts && yarn build-js", + "build-js": "lerna run build --scope codemirror-graphql --scope graphql-language-service-server --scope graphiql graphql-language-service", + "build-ts": "tsc --build", + "build-clean": "tsc --build --clean && rm -rf 'packages/**/src/{dist,esm,bundle}' && lerna run build-clean --parallel", "test": "yarn run lint && yarn run check && yarn run build && yarn run testonly && yarn run e2e", "testonly": "jest && lerna run test --scope codemirror-graphql", "e2e": "cd packages/graphiql && yarn e2e", - "cypress:open": "cd packages/graphiql && yarn e2e:server & cypress open --project ./packages/graphiql", + "cypress-open": "cd packages/graphiql && yarn e2e:server & cypress open --project ./packages/graphiql", "t": "yarn run testonly", - "lint": "eslint --ext=ts,js,jsx,tsx . || (printf '\\033[33mTry: \\033[7m yarn run lint -- --fix \\033[0m\\n' && exit 1)", - "lint:fix": "eslint --ext=ts,js,jsx,tsx . --fix", - "lint:check": "eslint --print-config .eslintrc.js | eslint-config-prettier-check", + "lint": "eslint --ext=ts,js,jsx,tsx . || (printf '\\033[33mTry: \\033[7m yarn format \\033[0m\\n' && exit 1)", + "lint-fix": "eslint --ext=ts,js,jsx,tsx . --fix", + "lint-check": "eslint --print-config .eslintrc.js | eslint-config-prettier-check", "check": "flow check --show-all-errors", "prepublish": "node resources/prepublish.js", "pretty": "node resources/pretty.js", "pretty-check": "node resources/pretty.js --check", - "version:release": "lerna version", - "version:prerelease": "lerna version --conventional-prerelease", - "version:graduate": "lerna version --conventional-graduate" + "version-release": "lerna version", + "version-prerelease": "lerna version --conventional-prerelease", + "version-graduate": "lerna version --conventional-graduate" }, "devDependencies": { "@babel/cli": "7.4.4", "@babel/core": "7.4.5", "@babel/node": "7.4.5", "@babel/plugin-proposal-class-properties": "7.4.4", + "@babel/plugin-syntax-dynamic-import": "^7.2.0", "@babel/plugin-transform-runtime": "^7.4.4", "@babel/polyfill": "^7.4.4", "@babel/preset-env": "7.4.5", @@ -50,6 +54,7 @@ "@commitlint/cli": "^8.1.0", "@commitlint/config-conventional": "^8.1.0", "@commitlint/config-lerna-scopes": "^8.1.0", + "@cypress/code-coverage": "^1.10.2", "@types/jest": "^24.0.18", "@typescript-eslint/parser": "^2.3.0", "babel-eslint": "^10.0.1", @@ -60,6 +65,7 @@ "eslint": "^6.4.0", "eslint-config-prettier": "6.3.0", "eslint-plugin-babel": "5.3.0", + "eslint-plugin-cypress": "^2.7.0", "eslint-plugin-flowtype": "4.3.0", "eslint-plugin-import": "^2.18.2", "eslint-plugin-prefer-object-spread": "1.2.1", @@ -74,6 +80,7 @@ "lerna": "^3.16.4", "mocha": "6.1.4", "prettier": "^1.18.2", + "rimraf": "^3.0.0", "ts-jest": "^24.1.0", "typescript": "^3.6.3", "wait-on": "^3.3.0" diff --git a/packages/codemirror-graphql/.gitignore b/packages/codemirror-graphql/.gitignore index 230058dcee0..b70dbf78038 100644 --- a/packages/codemirror-graphql/.gitignore +++ b/packages/codemirror-graphql/.gitignore @@ -1,6 +1,7 @@ node_modules/ coverage/ /*.js +/*.js.flow !babel.config.js /utils /variables diff --git a/packages/codemirror-graphql/babel.config.js b/packages/codemirror-graphql/babel.config.js index 42697e010a3..5646fbbd7ff 100644 --- a/packages/codemirror-graphql/babel.config.js +++ b/packages/codemirror-graphql/babel.config.js @@ -1,8 +1,12 @@ + module.exports = { presets: [ require.resolve('@babel/preset-env'), require.resolve('@babel/preset-flow'), require.resolve('@babel/preset-react'), ], - plugins: [require.resolve('@babel/plugin-proposal-class-properties')], + plugins: [ + require.resolve('@babel/plugin-proposal-class-properties'), + require.resolve('@babel/plugin-syntax-dynamic-import'), + ], }; diff --git a/packages/codemirror-graphql/package.json b/packages/codemirror-graphql/package.json index b5390b9950e..df611794d7a 100644 --- a/packages/codemirror-graphql/package.json +++ b/packages/codemirror-graphql/package.json @@ -14,17 +14,20 @@ }, "license": "MIT", "files": [ + "dist", "hint.js", "info.js", "jump.js", "lint.js", "mode.js", + "*.flow", "utils", "variables", "results", "README.md", "LICENSE" ], + "main": "dist", "options": { "mocha": "--full-trace --require resources/mochaBootload src/*/__tests__/*-test.js", "mocha_tdd": "--full-trace --watch --require resources/mochaBootload src/**/*/__tests__/*-test.js" @@ -32,8 +35,9 @@ "scripts": { "lint": "eslint src", "check": "flow check", - "build": "babel src --root-mode upward --ignore __tests__ --out-dir .", - "build-js": "node ../../resources/buildJs.js", + "build": "yarn build-clean && yarn build-js && yarn build-flow .", + "build-js": "babel src --root-mode upward --ignore src/__tests__ --out-dir .", + "build-clean": "rimraf {mode,hint,info,jump,lint}.{js,js.flow} && rimraf esm results utils variables coverage __tests__", "build-flow": "node ../../resources/buildFlow.js", "watch": "babel --optional runtime resources/watch.js | node", "prepublish": "node ../../resources/prepublish.js", @@ -54,6 +58,7 @@ "graphql": "^14.0.2", "jsdom": "^11.2.0", "mocha": "3.5.0", + "rimraf": "^3.0.0", "sane": "2.0.0" } } diff --git a/packages/examples/graphiql-cdn/.gitignore b/packages/examples/graphiql-cdn/.gitignore index adbb10bb9e5..07218a086e8 100644 --- a/packages/examples/graphiql-cdn/.gitignore +++ b/packages/examples/graphiql-cdn/.gitignore @@ -1,2 +1,3 @@ graphiql.js graphiql.css +renderExample.js diff --git a/packages/examples/graphiql-cdn/README.md b/packages/examples/graphiql-cdn/README.md index b43e163d7ca..fb9e6d6120b 100644 --- a/packages/examples/graphiql-cdn/README.md +++ b/packages/examples/graphiql-cdn/README.md @@ -1,14 +1,15 @@ Example GraphiQL Install ======================== -This example uses the browserified, unminified CDN version of GraphiQL found in packages/graphiql to make it easy to test changes. It's also used by netlify builds +This example uses the browserified, unminified CDN version of GraphiQL found in packages/graphiql to make it easy to test changes. It's also used by netlify builds. 1. Run `yarn` and `yarn build` in the root of this project 2. Navigate to this directory (packages/examples/graphiql-cdn) in Terminal 3. Then, run `yarn setup` and `yarn start` 4. Open your browser to the automatically generated address listed in your console. e.g. `Started on http://localhost:49811/` +5. To have it open on the same port consistently, use `PORT=3000 yarn start` ## Notes - If the `setup` script fails, it's because `graphiql` hasn't been built. -- Thanks to @orta being super clever, if you run this from a host other than localhost (i.e. remotely or by changing your /etc/hosts file) it will load the remote swapi graphql instead of the local server (the old graphcool one for now) +- Thanks to @orta, if you run this from a host other than localhost (i.e. remotely or by changing your /etc/hosts file) it will load the remote swapi graphql instead of the local server (the old graphcool one for now) diff --git a/packages/examples/graphiql-cdn/index.html b/packages/examples/graphiql-cdn/index.html index 8ec2f764170..31795dd79de 100644 --- a/packages/examples/graphiql-cdn/index.html +++ b/packages/examples/graphiql-cdn/index.html @@ -27,10 +27,8 @@ If you do not want to rely on a CDN, you can host these files locally or include them directly in your favored resource bunder. --> - - - - + + - + +