graphql / codemirror-graphql Goto Github PK
View Code? Open in Web Editor NEWGraphQL mode and helpers for CodeMirror.
GraphQL mode and helpers for CodeMirror.
Do you have a road map for the developer to keep up with your step?
Hey.
Thanks for this project. It's been hugely helpful in bringing GraphQL to the IntelliJ family.
Are there any plans to add support for the schema shorthand notation?
If not, and you're open to it, I'll see if I can find the time to do a PR. I'm assuming you'll prefer a separate mode like what was just added for variables?
If i want to use the latest version of all the graphql stack, this is how its going to look like:
"express-graphiql": "1.0.0",
"express-graphql": "0.6.1",
"graphiql": "0.8.1",
"graphql": "0.8.0-beta3",
"graphql-relay": "0.4.4",
While doing either a yarn or npm install i get a warning because codemirror-graphql doesnt find a suitable version (only has 0.6.0, 0.7.0 and 0.8.0), but when i want to move graphql forward to 0.8.3, i get a warning from the rest of the libraries that currently support (only has 0.6.0, 0.7.0 and 0.8.0-b).
It includes the [email protected] compatibility.
Thanks! ๐
Not on branch or tag
We would like to consume just the GraphQL mode file. Would it be possible to release that as its own package?
I have problems with GraphiQL if a query includes IDEOGRAPHIC SPACE (\u3000
).
I'm not sure it is a problem in codeirror-graphql or CodeMirror, but here is a reproducable test case which never completes (maybe with infinite loop?):
diff --git a/src/__tests__/mode-test.js b/src/__tests__/mode-test.js
index 77cc2b4..194b6d0 100644
--- a/src/__tests__/mode-test.js
+++ b/src/__tests__/mode-test.js
@@ -127,4 +127,19 @@ describe('graphql-mode', () => {
},
);
});
+
+ it('deals with IDEOGRAPHIC SPACE', () => {
+ const queryStr = '\u3000'
+ const tokens = [];
+ const styles = [];
+
+ CodeMirror.runMode(queryStr, 'graphql', (token, style) => {
+ if (style && style !== 'ws') {
+ tokens.push(token);
+ styles.push(style);
+ }
+ });
+
+ expect(styles).to.deep.equal([]);
+ });
});
0.4.0 is not the lastest version
Hello everyone,
I am using graphql java implementation and codemirror in client side to test graphql apis. Now i need to show type suggestion in client side. After many search i ended up here https://github.com/graphql/codemirror-graphql, how to pass graphql schema to codemirror. How to bring schema from java server side to client side.
I heard we can using query interpolation to build schema in client side, if this possible plz explain how to do this.
Hello,
So I have a project using codemirror and this package for working with graphql queries. Everything seems to work fine, but looking at the demo GIF on this repo, and in other projects, there is a description of the items in the autocomplete at the base of the autocomplete. I've not been able to get mine to show that description, and I am stuck at this point. Please any ideas on what is missing? https://github.com/imolorhe/altair/blob/staging/src/app/query-editor/query-editor.component.ts#L162
Hi,
Thank for this awesome project and graphQL in general, what a revolution.
I use intelliJ Idea with JS GraphQL IntelliJ Plugin, I noticed it didn't suggest fragment when I type "...", this would be a nice feature if it's not too much to ask.
Thank you again.
RFC for null value - the latest graphql-js implemented this.
This would allow Relay fragments (which omit the name) to be parsed correctly.
https://github.com/graphql/codemirror-graphql/blob/master/src/mode.js#L382
@wincent - since we've extracted the parse package into its own, should we pull that package in here and start using it?
https://github.com/graphql/graphiql#usage-examples
// GraphiQL automatically fills in leaf nodes when the query
// does not provide them. Change this if your GraphQL Definitions
// should behave differently than what's defined here:
// (https://github.com/graphql/graphiql/blob/master/src/utility/fillLeafs.js#L75)
getDefaultFieldNames: null
when no query and press cmd + enter
, automatically fills in leaf nodes like GraphiQL
The peer dependencies listed here don't include graphql 0.11.x, which has been out for two months. Is there an incompatibility or does it just need to be updated?
{ ... @{directive} }
or { ... { } }
aren't optional, contrary to what the specification says.
In npm version:
_codemirror2.default.registerHelper('lint', 'graphql', function (text, options, editor) {
var schema = options.schema;
if (!schema) {
return [];
}
try {
var ast = (0, _graphql.parse)(text);
var validationErrorAnnotations = mapCat((0, _graphql.validate)(schema, ast), function (error) {
return annotations(editor, error, 'error', 'validation');
});
// Note: findDeprecatedUsages was added in [email protected], but we want to
// support older versions of graphql-js.
var deprecationWarningAnnotations = !_graphql.findDeprecatedUsages ? [] : mapCat((0, _graphql.findDeprecatedUsages)(schema, ast), function (error) {
return annotations(editor, error, 'warning', 'deprecation');
});
return validationErrorAnnotations.concat(deprecationWarningAnnotations);
} catch (error) {
var location = error.locations[0];
var pos = _codemirror2.default.Pos(location.line - 1, location.column);
var token = editor.getTokenAt(pos);
return [{
message: error.message,
severity: 'error',
type: 'syntax',
from: _codemirror2.default.Pos(location.line - 1, token.start),
to: _codemirror2.default.Pos(location.line - 1, token.end)
}];
}
});
function annotations(editor, error, severity, type) {
return error.nodes.map(function (node) {
var highlightNode = node.kind !== 'Variable' && node.name ? node.name : node.variable ? node.variable : node;
return {
message: error.message,
severity: severity,
type: type,
from: editor.posFromIndex(highlightNode.loc.start),
to: editor.posFromIndex(highlightNode.loc.end)
};
});
}
// General utility for map-cating (aka flat-mapping).
function mapCat(array, mapper) {
return Array.prototype.concat.apply([], array.map(mapper));
}
On the github lastest version(same 0.6.3):
CodeMirror.registerHelper('lint', 'graphql', (text, options) => {
const schema = options.schema;
const rawResults = getDiagnostics(text, schema);
const results = rawResults.map(error => ({
message: error.message,
severity: SEVERITY[error.severity],
type: error.source,
from: error.range.start,
to: error.range.end,
}));
return results;
});
I think may be it is not the latest version on the npm verion, but it's 0.6.3 same with the version on github.But the code is quite different, what happend?
Is there a way to specify a link to a certain view with the docs panel open?
I am getting an increasing number of problems due to different versions of graphql in the codebase.
And most of all: due to an issue in graphql versions before v13 that creates errors when multiple instances of graphql (even the same version) were created, see: https://github.com/graphql/graphql-js/releases/tag/v0.13.0 "Only trigger "one instance of graphql" error in DEV environments, removing false errors from minified bundles".
I am using a resolutions key in package.json to circumvent problems:
"resolutions": {
"graphql": "0.13.2"
}
npm ls
graphql lists in my case:
alexa@DESKTOP-6C4V66Q C:\Users\alexa\ae2
> npm ls graphql
[email protected] C:\Users\alexa\ae2
+-- [email protected]
| `-- [email protected]
| `-- [email protected]
| `-- [email protected]
| +-- UNMET DEPENDENCY graphql@^0.12.3
| `-- [email protected]
| `-- UNMET DEPENDENCY graphql@^0.12.3
`-- [email protected]
`-- UNMET DEPENDENCY graphql@>=0.6 <0.13
npm ERR! missing: graphql@^0.12.3, required by [email protected]
npm ERR! missing: graphql@^0.12.3, required by [email protected]
npm ERR! missing: graphql@>=0.6 <0.13, required by [email protected]
Someone else has asked postgraphile to update to graphql v13 but that seems blocked because of codemirror-graphql: graphile/crystal#720
I also submitted an issue to the GraphiQL repo, but since it's raised from within graphql-language-interface
, I thought I'd repost it here.
I'm getting the following error:
Uncaught TypeError: Cannot read property '0' of undefined
at getDiagnostics (getDiagnostics.js?6960:46)
at eval (lint.js?eb0c:38)
at startLinting (lint.js?af2c:147)
at Object.eval [as lint] (lint.js?af2c:241)
at new CodeMirror$1 (codemirror.js?f14e:7645)
at CodeMirror$1 (codemirror.js?f14e:7590)
at QueryEditor.componentDidMount (QueryEditor.js?39d7:115)
at eval (ReactCompositeComponent.js?063f:264)
at measureLifeCyclePerf (ReactCompositeComponent.js?063f:75)
at eval (ReactCompositeComponent.js?063f:263)
In GetDiagnostics, the error happens in the last line of the following code:
try {
ast = (0, _graphql.parse)(queryText);
} catch (error) {
var range = getRange(error.locations[0], queryText);
I'm trying to put a breakpoint ether at the start of the catch block, so I can se the original error, but Chrome's dev tools won't let me.
Putting a breakpoint on the ast = ...
line, all local variables are undefined, except queryText
, which is equal to:
"# Welcome to GraphiQL
#
# GraphiQL is an in-browser tool for writing, validating, and
# testing GraphQL queries.
#
# Type queries into this side of the screen, and you will see intelligent
# typeaheads aware of the current GraphQL type schema and live syntax and
# validation errors highlighted within the text.
#
# GraphQL queries typically start with a "{" character. Lines that starts
# with a # are ignored.
#
# An example GraphQL query might look like:
#
# {
# field(arg: "value") {
# subField
# }
# }
#
# Keyboard shortcuts:
#
# Run Query: Ctrl-Enter (or press the play button above)
#
# Auto Complete: Ctrl-Space (or just start typing)
#
"
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.