Allow for easier template overrides in graphiql (#863)

* don't replace <body> * Update graphene_django/templates/graphene/graphiql.html Co-Authored-By: Jonathan Kim <jkimbo@gmail.com> * Fix editor styling and initialisation Co-authored-by: Jonathan Kim <jkimbo@gmail.com>
graphql-python · Feb 7, 2020 · 6b8c5bd · 6b8c5bd
1 parent f3f0608
commit 6b8c5bd
Show file tree

Hide file tree

Showing 2 changed files with 3 additions and 2 deletions.
diff --git a/graphene_django/static/graphene_django/graphiql.js b/graphene_django/static/graphene_django/graphiql.js
@@ -97,6 +97,6 @@
   // Render <GraphiQL /> into the body.
   ReactDOM.render(
     React.createElement(GraphiQL, options),
-    document.body
+    document.getElementById("editor")
   );
 })();
diff --git a/graphene_django/templates/graphene/graphiql.html b/graphene_django/templates/graphene/graphiql.html
@@ -10,7 +10,7 @@
 <html>
 <head>
   <style>
-    html, body {
+    html, body, #editor {
       height: 100%;
       margin: 0;
       overflow: hidden;
@@ -31,6 +31,7 @@
           crossorigin="anonymous"></script>
 </head>
 <body>
+  <div id="editor"></div>
   {% csrf_token %}
   <script src="{% static 'graphene_django/graphiql.js' %}"></script>
 </body>