diff options
| author | Kamil Trzciński <ayufan@ayufan.eu> | 2019-09-12 12:01:21 +0300 |
|---|---|---|
| committer | Kamil Trzciński <ayufan@ayufan.eu> | 2019-09-12 12:01:21 +0300 |
| commit | 10c440c1e6aab0748d31f247d6a7ef936c81aaab (patch) | |
| tree | 0f0933f83abe61295280bb9f93766e4c38b3c978 /app | |
| parent | 11f5e7fe378d4c506e8485eadf90085fb3fab6e4 (diff) | |
| parent | e078d51566a276558a0bbd283f8acc472d4530c9 (diff) | |
Merge branch 'sh-revert-graphiql-version' into 'master'
Make /-/graphql-explorer work again
See merge request gitlab-org/gitlab-ce!32952
Diffstat (limited to 'app')
| -rw-r--r-- | app/views/graphiql/rails/editors/show.html.erb | 99 |
1 files changed, 90 insertions, 9 deletions
diff --git a/app/views/graphiql/rails/editors/show.html.erb b/app/views/graphiql/rails/editors/show.html.erb index abb1ed0e772..b8f82ae8323 100644 --- a/app/views/graphiql/rails/editors/show.html.erb +++ b/app/views/graphiql/rails/editors/show.html.erb @@ -1,18 +1,99 @@ <!DOCTYPE html> <html> <head> - <title><%= GraphiQL::Rails.config.title || 'GraphiQL' %></title> - + <title>GraphiQL</title> <%= stylesheet_link_tag("graphiql/rails/application") %> + <%# TODO: This file was included to fix a CSP failure. Please remove when https://github.com/rmosolgo/graphiql-rails/pull/71 will be released %> <%= javascript_include_tag("graphiql/rails/application", nonce: true) %> </head> <body> - <%= content_tag :div, 'Loading...', id: 'graphiql-container', data: { - graphql_endpoint_path: graphql_endpoint_path, - initial_query: GraphiQL::Rails.config.initial_query, - logo: GraphiQL::Rails.config.logo, - headers: GraphiQL::Rails.config.resolve_headers(self), - query_params: GraphiQL::Rails.config.query_params - } %> + <div id="graphiql-container"> + Loading... + </div> + <%= javascript_tag nonce: true do -%> + var parameters = {}; + + <% if GraphiQL::Rails.config.query_params %> + // Parse the search string to get url parameters. + var search = window.location.search; + search.substr(1).split('&').forEach(function (entry) { + var eq = entry.indexOf('='); + if (eq >= 0) { + parameters[decodeURIComponent(entry.slice(0, eq))] = + decodeURIComponent(entry.slice(eq + 1)); + } + }); + // if variables was provided, try to format it. + if (parameters.variables) { + try { + parameters.variables = + JSON.stringify(JSON.parse(parameters.variables), null, 2); + } catch (e) { + // Do nothing, we want to display the invalid JSON as a string, rather + // than present an error. + } + } + // When the query and variables string is edited, update the URL bar so + // that it can be easily shared + function onEditQuery(newQuery) { + parameters.query = newQuery; + updateURL(); + } + function onEditVariables(newVariables) { + parameters.variables = newVariables; + updateURL(); + } + function updateURL() { + var newSearch = '?' + Object.keys(parameters).map(function (key) { + return encodeURIComponent(key) + '=' + + encodeURIComponent(parameters[key]); + }).join('&'); + history.replaceState(null, null, newSearch); + } + <% end %> + + // Defines a GraphQL fetcher using the fetch API. + var graphQLEndpoint = "<%= graphql_endpoint_path %>"; + function graphQLFetcher(graphQLParams) { + return fetch(graphQLEndpoint, { + method: 'post', + headers: <%= raw JSON.pretty_generate(GraphiQL::Rails.config.resolve_headers(self)) %>, + body: JSON.stringify(graphQLParams), + credentials: 'include', + }).then(function(response) { + return response.text(); + }).then(function(text) { + try { + return JSON.parse(text); + } catch(error) { + return { + "message": "The server responded with invalid JSON, this is probably a server-side error", + "response": text, + }; + } + }) + } + + <% if GraphiQL::Rails.config.initial_query %> + var defaultQuery = "<%= GraphiQL::Rails.config.initial_query.gsub("\n", '\n').gsub('"', '\"').html_safe %>"; + <% else %> + var defaultQuery = undefined + <% end %> + + // Render <GraphiQL /> into the body. + ReactDOM.render( + React.createElement(GraphiQL, { + fetcher: graphQLFetcher, + defaultQuery: defaultQuery, + <% if GraphiQL::Rails.config.query_params %> + query: parameters.query, + variables: parameters.variables, + onEditQuery: onEditQuery, + onEditVariables: onEditVariables + <% end %> + }), + document.getElementById("graphiql-container") + ); + <% end -%> </body> </html> |