Render GitHub emoji shortcodes missing from JoyPixels#89
Merged
ThisIs-Developer merged 2 commits intomainfrom May 6, 2026
Merged
Render GitHub emoji shortcodes missing from JoyPixels#89ThisIs-Developer merged 2 commits intomainfrom
ThisIs-Developer merged 2 commits intomainfrom
Conversation
Agent-Logs-Url: https://github.com/ThisIs-Developer/Markdown-Viewer/sessions/f228e998-7f39-496e-b4f1-ebb2774c3c69 Co-authored-by: ThisIs-Developer <109382325+ThisIs-Developer@users.noreply.github.com>
Agent-Logs-Url: https://github.com/ThisIs-Developer/Markdown-Viewer/sessions/f228e998-7f39-496e-b4f1-ebb2774c3c69 Co-authored-by: ThisIs-Developer <109382325+ThisIs-Developer@users.noreply.github.com>
Copilot created this pull request from a session on behalf of
ThisIs-Developer
May 6, 2026 09:29
View session
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
There was a problem hiding this comment.
Pull request overview
This PR fixes GitHub-style emoji shortcodes that JoyPixels can’t convert by lazily loading GitHub’s emoji metadata and rendering missing shortcodes as inline <img> elements, with consistent sizing/baseline styling across web and desktop builds.
Changes:
- Add inline emoji
<img>rendering fallback for shortcodes not supported by JoyPixels, backed by GitHub’s/emojismetadata. - Trigger a one-time async emoji metadata fetch when missing shortcodes are detected, then re-render the preview once data is available.
- Add CSS to size/align inline emoji images consistently in both the web and desktop resource copies.
Reviewed changes
Copilot reviewed 4 out of 4 changed files in this pull request and generated 4 comments.
| File | Description |
|---|---|
| styles.css | Adds .emoji-inline styling for consistent inline emoji image sizing/alignment in rendered markdown. |
| script.js | Adds GitHub emoji URL lookup + fallback rendering to inline images when JoyPixels doesn’t convert a shortcode. |
| desktop-app/resources/styles.css | Mirrors .emoji-inline styling for desktop build parity. |
| desktop-app/resources/js/script.js | Mirrors emoji fallback logic for desktop parity (and aligns alert modal option-building with root copy). |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
Comment on lines
+1567
to
+1573
| const image = document.createElement('img'); | ||
| image.className = 'emoji-inline'; | ||
| image.src = emojiUrl; | ||
| image.alt = `:${shortcode}:`; | ||
| image.loading = 'lazy'; | ||
| image.setAttribute('aria-label', `:${shortcode}:`); | ||
| fragment.appendChild(image); |
Comment on lines
+1567
to
+1573
| const image = document.createElement('img'); | ||
| image.className = 'emoji-inline'; | ||
| image.src = emojiUrl; | ||
| image.alt = `:${shortcode}:`; | ||
| image.loading = 'lazy'; | ||
| image.setAttribute('aria-label', `:${shortcode}:`); | ||
| fragment.appendChild(image); |
| console.error('Failed to load GitHub emojis:', error); | ||
| emojiEntries = []; | ||
| emojiUrlMap = new Map(); | ||
| emojiLookupLoaded = true; |
| console.error('Failed to load GitHub emojis:', error); | ||
| emojiEntries = []; | ||
| emojiUrlMap = new Map(); | ||
| emojiLookupLoaded = true; |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
GitHub-style emoji shortcodes from the provided list were showing as raw text in the preview. The gap was limited to shortcodes not covered by JoyPixels.
Example: