Upgrading graphiql and voyager.

Author: fubhy

assets/explorer/dist/bundle.min.js

@@ -43,6 +43,7 @@
   -webkit-box-flex: 1;
       -ms-flex: 1;
           flex: 1;
+  overflow-x: hidden;
 }
 
 .graphiql-container .title {
@@ -83,6 +84,7 @@
       -ms-flex: 1;
           flex: 1;
   height: 34px;
+  overflow-y: visible;
   padding: 7px 14px 6px;
   -webkit-user-select: none;
      -moz-user-select: none;
@@ -760,7 +762,7 @@ div.CodeMirror-lint-tooltip > * + * {
 
 /* CURSOR */
 
-.CodeMirror div.CodeMirror-cursor {
+.CodeMirror .CodeMirror-cursor {
   border-left: 1px solid black;
 }
 /* Shown when moving in bi-directional text */
@@ -1230,7 +1232,6 @@ span.CodeMirror-selectedtext { background: none; }
   margin-left: 5px;
   overflow: hidden;
   text-overflow: ellipsis;
-  white-space: nowrap;
 }
 
 .graphiql-container .enum-value {
@@ -1258,7 +1259,7 @@ span.CodeMirror-selectedtext { background: none; }
 }
 
 .graphiql-container .arg-default-value {
-  color: #0B7FC7;
+  color: #43A047;
 }
 
 .graphiql-container .doc-deprecation {

assets/explorer/dist/explorer.css renamed to assets/explorer/dist/container.css

@@ -6,24 +6,24 @@
     "lint": "eslint src"
   },
   "dependencies": {
-    "graphiql": "^0.11.2",
-    "graphql": "^0.10.3",
-    "react": "^15.6.1",
-    "react-dom": "^15.6.1"
+    "graphiql": "^0.11.10",
+    "graphql": "^0.11.7",
+    "react": "^16.0.0",
+    "react-dom": "^16.0.0"
   },
   "devDependencies": {
     "babel": "^6.23.0",
-    "babel-core": "^6.25.0",
-    "babel-eslint": "^7.2.3",
-    "babel-loader": "^7.1.1",
+    "babel-core": "^6.26.0",
+    "babel-eslint": "^8.0.2",
+    "babel-loader": "^7.1.2",
     "babel-preset-es2015": "^6.24.1",
     "babel-preset-react": "^6.24.1",
     "babel-preset-stage-0": "^6.24.1",
-    "copy-webpack-plugin": "^4.0.1",
-    "eslint": "^4.2.0",
-    "eslint-config-airbnb": "^15.0.2",
-    "eslint-plugin-import": "^2.7.0",
-    "rimraf": "^2.6.1",
-    "webpack": "^3.1.0"
+    "copy-webpack-plugin": "^4.2.0",
+    "eslint": "^4.10.0",
+    "eslint-config-airbnb": "^16.1.0",
+    "eslint-plugin-import": "^2.8.0",
+    "rimraf": "^2.6.2",
+    "webpack": "^3.8.1"
   }
 }

assets/explorer/dist/graphiql.css

@@ -3,6 +3,7 @@ import ReactDOM from 'react-dom';
 import Drupal from 'drupal';
 import jQuery from 'jquery';
 import GraphiQL from 'graphiql';
+import { buildClientSchema } from 'graphql';
 
 /**
  * Behavior for rendering the GraphiQL interface.
@@ -15,6 +16,9 @@ Drupal.behaviors.graphQLRenderExplorer = {
       return;
     }
 
+    // Build a schema from the passed introspection data.
+    const graphQLSchema = buildClientSchema(settings.graphqlIntrospectionData.data);
+
     // Defines a GraphQL fetcher using the fetch API.
     const graphQLFetcher = (graphQLParams) => fetch(settings.graphqlRequestUrl, {
       method: 'post',
@@ -29,6 +33,7 @@ Drupal.behaviors.graphQLRenderExplorer = {
     ReactDOM.render(
       React.createElement(GraphiQL, {
         fetcher: graphQLFetcher,
+        schema: graphQLSchema,
       }), container
     );
   },

assets/explorer/package.json

@@ -32,7 +32,7 @@ module.exports = {
     }),
     new CopyWebpackPlugin([
       { from: path.resolve(__dirname, 'node_modules/graphiql/graphiql.css') },
-      { from: path.resolve(__dirname, 'src/explorer.css') },
+      { from: path.resolve(__dirname, 'src/container.css') },
     ]),
   ]).concat(process.env.NODE_ENV === 'production' ? [
     new webpack.optimize.UglifyJsPlugin({