chore: Bump codemirror #1148
chore: Bump codemirror #1148
Conversation
| // Custom theme that better matches our Prism config, though | ||
| // the lexer is somewhat limited so it still deviates |
There was a problem hiding this comment.
Theme doesn't quite match our Prism config perfectly, but it's a better match than the previous was.
There was a heck of a lot of gold/yellow highlighting in the previous theme.
rschristian
force-pushed
the
chore/bump-codemirror
branch
4 times, most recently
from
9850f20
to
9c64641
Compare
rschristian
force-pushed
the
chore/bump-codemirror
branch
2 times, most recently
from
24a21c8
to
e9e06c7
Compare
rschristian
force-pushed
the
chore/bump-codemirror
branch
3 times, most recently
from
43ca72d
to
eae5751
Compare
rschristian
force-pushed
the
chore/bump-codemirror
branch
from
a341723
to
7665714
Compare
| const highlightStyle = HighlightStyle.define([ | ||
| { tag: tags.keyword, class: 'cm-keyword' }, | ||
| { tag: [tags.definition(tags.function(tags.name)), tags.function(tags.name), tags.propertyName], class: 'cm-function' }, | ||
| { tag: tags.literal, class: 'cm-literal' }, | ||
| { tag: tags.tagName, class: 'cm-tag' }, | ||
| { tag: tags.attributeName, class: 'cm-attribute' }, | ||
| { tag: tags.string, class: 'cm-string' }, | ||
| { tag: [tags.operator], class: 'cm-operator' }, | ||
| { tag: tags.comment, class: 'cm-comment' }, | ||
| { tag: tags.invalid, class: 'cm-invalid' } | ||
| ]); |
There was a problem hiding this comment.
I checked some of our code snippets and everything seems to be covered, but let me know if anyone spots anything that is missing or off looking.
| useEffect(() => { | ||
| if (props.slug || !editor.current) routeHasChanged.current = true; | ||
| }, [props.slug]); |
There was a problem hiding this comment.
I'm quite convinced preact-iso is problematic in its behavior here.
Unfortunately, it updates the route context first-thing, passing the new path, params, etc. as soon as it has found a matching route. This bites us pretty badly here as while we need to watch for route changes, the corresponding content for that route change will always come in separately and later.
Unless someone's got a better idea (and it's very possible I'm missing something obvious, I've been beating my head against this for way more hours than I'd like to admit to), I think we need something along these lines here for now.
We need some way of differentiating w/ iso, in components, a new incoming route to load new data and a finished route change (here we'd watch the later). This will probably be a breaking change and will require unraveling the router a fair bit, so on my ever-growing TODO list it goes.
| this.showErrorTimer = setTimeout(() => { | ||
| this.editor.operation(() => { | ||
| let { left } = this.editor.cursorCoords( | ||
| { line: error.loc.line - 1, ch: error.loc.column - 1 }, | ||
| 'local' | ||
| ); | ||
| let ref; | ||
| const errorLine = ( | ||
| <div ref={r => (ref = r)} class={style.lintError}> | ||
| <pre style={`padding-left:${left}px;`}>▲</pre> | ||
| <div>🔥 {error.message.split('\n')[0]}</div> | ||
| </div> | ||
| ); | ||
| render(errorLine, this.scratch); | ||
| this.errors = [this.editor.addLineWidget(error.loc.line - 1, ref)]; | ||
| }); | ||
| }, 1000); | ||
| } |
There was a problem hiding this comment.
Errors in the editor have been broken for a fair while now, I think it was #971? The error stack in the runner pane is completely void of positioning info which, I'm guessing, leads into a lack of editor errors as we can't place them.
I'll look at re-adding this soon, once I fix the error stack traces.
Edit: Tracking in #1158
There was a problem hiding this comment.
Actually, the tutorial does seem to show errors occasionally. Will need to take another look.
There was a problem hiding this comment.
The error positioning is pretty touchy & limited, we can't effectively map the built output back to the code editor input.
Redoing the compilation is a can of worms I don't want to address here. For now, I've disabled the error overlay in the editor as it barely works and tends to point at the wrong line entirely.
rschristian
force-pushed
the
chore/bump-codemirror
branch
from
d48f47b
to
a70e569
Compare
rschristian
force-pushed
the
chore/bump-codemirror
branch
6 times, most recently
from
b2965d4
to
7bfc449
Compare
rschristian
force-pushed
the
chore/bump-codemirror
branch
from
7bfc449
to
b87d113
Compare
Bumps CodeMirror up to v6, somewhat pulled from #793 (man was that PR a gold mine of stuff). Bit of an increase on the bundle size (loading the 'Simple Counter' w/ no cache:
393kb->448kb,-12kbfor the uncompressed favicon in preview, or ~43kb bump), but I don't think it's too bad.I've enabled auto completion (basic, but not bad) and bracket matching with this bump, seem like general nice-to-haves and I am already quite happy with these. There seems to be quite a bit more we can also enable/play around with in the future too.