-
-
Notifications
You must be signed in to change notification settings - Fork 1.3k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Use CodeMirror 6 in REPL #3014
base: main
Are you sure you want to change the base?
Use CodeMirror 6 in REPL #3014
Conversation
✅ Deploy Preview for babel-next ready!
To edit notification comments on pull requests, go to your Netlify site configuration. |
|
||
type Props = { | ||
autoFocus: boolean; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
The autoFocus
prop is removed because we are not using this prop.
✅ Deploy Preview for babel ready!
To edit notification comments on pull requests, go to your Netlify site configuration. |
} | ||
|
||
injectGlobal({ | ||
".CodeMirror": { | ||
height: "100% !important", | ||
width: "100% !important", | ||
WebkitOverflowScrolling: "touch", |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This CSS property is long obsolete.
@@ -30,7 +33,7 @@ export default function CodeMirrorPanel(props: Props) { | |||
<CodeMirror | |||
onChange={onChange} | |||
options={{ | |||
...props.options, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
The fileSize
option is not used by the codemirror component. So here we explicitly specify the passing-through options.
6d59fea
to
9434c05
Compare
The CodeMirror component will be rendered directly within the parentRef.
In this PR we migrate the CodeMirror from 5 to 6 for REPL.
New features from this upgrade:
This is a vast rewrite of the
CodeMirror
bridging React component. Here are the UI tests I have performed manually:preserveScrollPosition
: Input a 300-line text, scroll the output to the bottom, change the input, the output should preserve the scroll positionlineWrapping
: Input a 300-column text, toggle the "Line Wrap" option, the input should apply softwrapreadOnly
: The output editor should be readonlyPreview link: https://deploy-preview-3014--babel.netlify.app/repl