-
Notifications
You must be signed in to change notification settings - Fork 10.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
[gatsby-remark-prism]: Hightlighting empty line hides it from source view and moves other lines up #17849
Comments
Hiya! This issue has gone quiet. Spooky quiet. 👻 We get a lot of issues, so we currently close issues after 30 days of inactivity. It’s been at least 20 days since the last update here. If we missed this issue or if you want to keep it open, please reply here. You can also add the label "not stale" to keep this issue open! As a friendly reminder: the best way to see this issue, or any other, fixed is to open a Pull Request. Check out gatsby.dev/contribute for more information about opening PRs, triaging issues, and contributing! Thanks for being a part of the Gatsby community! 💪💜 |
It is not stale. |
Hey @ethernal sorry for the late response. To help us best begin debugging the underlying cause, it is incredibly helpful if you're able to create a minimal reproduction. This is a simplified example of the issue that makes it clear and obvious what the issue is and how we can begin to debug it. If you're up for it, we'd very much appreciate if you could provide a minimal reproduction and we'll be able to take another look. Thanks for using Gatsby! 💜 |
Here is the repo with code: https://github.com/ethernal/gatsby-remark-prism-example I removed most data but left all other stuff. Please navigate to Blog->Hello World. You will see the exact problem. After modifying react prism it will go away. |
same issue |
- Didn't fix issue with line highlighting though. - Looks to be related to gatsbyjs/gatsby/issues/17849 - Found fix in PR gatsbyjs/gatsby/pull/18719, implementing manually in `node_modules` helps, but doesn't completely resolve the issue - Committing updates & pushing to v1.4 minor update, but leaving this issue open pending a real resolution.
Hi! I'm closing this as a stale issue as in the meantime Gatsby 4 and related packages were released. You can check our Framework Version Support Page to see which versions currently receive active support. Please try the mentioned issue on the latest version (using the Thanks! |
Description
Issue was automatically closed. Reopening as new one.
This issue is for gatsby-remark-prism plugin.
When highlighting empty line it disappears due to rendering of empty span.
ex. in case line 3 is empty and lines 3, 5 and 6 should be highlighted the code will produce almost expected results but the lines 5 and 6 will have numbers 4 and 5 and line 3 will be not visible.
Steps to reproduce
Tested in Firefox and Chrome.
CSS files are from documentation site.
Order did not matter.
####gatsby-browser.js
MDX file
set code options to:
javascript {numberLines: true}{4,8,13}
Mark empty line to highlight it or include empty line in highlight range.
Expected result
Empty line should be highlighted as removing/hiding it breaks the line numbering logic.
Actual result
Line disappears due to span being empty.
Solution
in directives.js in
gatsby-remark-prism
change line:
to:
I will make a PR for this and link it here.
It might be that only I am affected as the issue is annoying and would have been reported already, I think.
Environment
Run
gatsby info --clipboard
in your project directory and paste the output here.System:
OS: Windows 10
CPU: (8) x64 Intel(R) Core(TM) i7-8550U CPU @ 1.80GHz
Binaries:
Node: 12.1.0 - D:\software\nodejs\node.EXE
Yarn: 1.17.3 - D:\software\yarn\bin\yarn.CMD
npm: 6.9.0 - D:\software\nodejs\npm.CMD
Languages:
Python: 2.7.15 - /c/Users/xxxxxx/.windows-build-tools/python27/python
Browsers:
Edge: 42.17134.1.0
npmPackages:
gatsby: ^2.13.12 => 2.13.12
gatsby-image: ^2.2.4 => 2.2.4
gatsby-plugin-emotion: ^4.1.2 => 4.1.2
gatsby-plugin-manifest: ^2.2.1 => 2.2.1
gatsby-plugin-mdx: ^1.0.11 => 1.0.11
gatsby-plugin-offline: ^2.2.1 => 2.2.1
gatsby-plugin-react-helmet: ^3.1.0 => 3.1.0
gatsby-plugin-sharp: ^2.2.3 => 2.2.3
gatsby-plugin-typography: ^2.3.3 => 2.3.3
gatsby-remark-embed-snippet: ^4.1.2 => 4.1.2
gatsby-remark-emoji: ^0.0.3 => 0.0.3
gatsby-remark-images: ^3.1.3 => 3.1.3
gatsby-remark-prismjs: ^3.3.5 => 3.3.5
gatsby-source-filesystem: ^2.1.3 => 2.1.3
gatsby-transformer-remark: ^2.6.14 => 2.6.14
gatsby-transformer-sharp: ^2.2.1 => 2.2.1
The text was updated successfully, but these errors were encountered: