Switch SVG loading from the Batik library to JSVG - #7941

Merged
eirikbakke merged 1 commit into
apache:masterfrom
eirikbakke:pr-jsvg
Nov 16, 2024
Merged

Switch SVG loading from the Batik library to JSVG#7941
eirikbakke merged 1 commit into
apache:masterfrom
eirikbakke:pr-jsvg

Conversation

@eirikbakke

Copy link
Copy Markdown
Contributor

Per our discussion in #7463 (comment) and #7938 , here is a PR that switches SVG loading routine in ImageUtilities from the Batik library to the much more lightweight JSVG library.

It's a draft that needs more testing, so I have added the do-not-merge label for now. But I'm leaving the work here since it might benefit #7938.

@eirikbakkeeirikbakke added do not merge Don't merge this PR, it is not ready or just demonstration purposes. Platform [ci] enable platform tests (platform/*) UI User Interface labels Nov 7, 2024
@eirikbakkeeirikbakke mentioned this pull request Nov 7, 2024
@matthiasblaesing

Copy link
Copy Markdown
Contributor

For testing the rendering you render render all svgs both with batik and jsvg and diff the two.

@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

There's a lot of bugs that can happen in the full application context, rather than in an isolated script, so I prefer to test the full app. (Dimensions, hints, HiDPI scaling, ImageProducer/ImageObserver/ColorModel stuff, caching etc.)

@matthiasblaesing

Copy link
Copy Markdown
Contributor

There's a lot of bugs that can happen in the full application context, rather than in an isolated script, so I prefer to test the full app. (Dimensions, hints, HiDPI scaling, ImageProducer/ImageObserver/ColorModel stuff, caching etc.)

Sure, it was an idea and could catch the most obvious problem.

@eirikbakke
eirikbakkeforce-pushed the pr-jsvg branch 5 times, most recently from 8110b4c to 0fa8094CompareNovember 7, 2024 21:43
@mbienmbien added the ci:dev-build [ci] produce a dev-build zip artifact (7 days expiration, see link on workflow summary page) label Nov 7, 2024
@eirikbakke
eirikbakkeforce-pushed the pr-jsvg branch 2 times, most recently from d510758 to 136a6a9CompareNovember 8, 2024 00:04
@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

Sorry for all the force-pushes... I was fidgeting to get the "paperwork" test to pass.

@mbien

mbien commented Nov 9, 2024

Copy link
Copy Markdown
Member

Sorry for all the force-pushes... I was fidgeting to get the "paperwork" test to pass.

no worries, thats what CI is for.

same comparison as in #7463 (comment)

svg-icons_impl_comparison

batik is on the left, jsvg on the right (I think). I can't tell the difference - so its either not working or it works perfectly ;)

@matthiasblaesing

Copy link
Copy Markdown
Contributor

First impression is good. I rebuild my "work" NetBeans with this applied and did not notice a difference.

@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

Yes, looks rather identical. Just to verify that the JSVG library is actually being used, I inserted a drawLine right after the call to com.github.weisj.jsvg.SVGDocument.renderWithPlatform. Confirmed:

image

Note that the PR does not actually remove the platform/libs.batik.read module, just the dependency on it from platform/openide.util.ui.svg . Removing the batik library entirely could be done separately if desired.

@eirikbakke

eirikbakke commented Nov 9, 2024

Copy link
Copy Markdown
ContributorAuthor

I do see some cases where the icons for Undo, Redo, and Quick Search appear with the right shape, but a black fill, even though other icons look fine. Then in another case they looked OK. Will require some more investigation.

image

@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

OK, the "black shapes" problem was only with some older SVG files that we no longer use. They were generated using a now-deprecated setting in Adobe Illustrator.

(Full details: The problem occurred only on an my private build of NetBeans, which had some older versions of the SVG files that were generated with other Adobe Illustrator settings. All of those SVG files were regenerated in #7463, and replaced with versions that appear to work with JSVG. The README file merged in apache/netbeans-tools#67 lists the correct settings to use when generating SVGs from Adobe Illustrator. I filed an issue at weisJ/jsvg#96 to document the all-black icon issue, but it's not actually a problem for us as SVG files are now generated in a different way, and the setting that caused problems is now deprecated in Adobe Illustrator anyway.)

@eirikbakkeeirikbakke removed the do not merge Don't merge this PR, it is not ready or just demonstration purposes. label Nov 9, 2024
@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

I have now tested the patch on a build of master, in my working IDE (which is a private build based on NetBeans 22), and in my NetBeans Platform application (which has a bunch of additional icons beyond those in the IDE). The rendering seems to be entirely equivalent to Batik for our particular SVG files.

I think the PR is ready for review now, so I remove the do-not-merge label.

@matthiasblaesingmatthiasblaesing left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Minimal nitpick, apart from these this looks good to me. Thank you.

I think it would be good to create an issue with target NB25 to remove batik library. It makes no sense to ship a library we don't use, on the other hand I think it would be good to give this some time in master before removing batik.

@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

I think it would be good to create an issue with target NB25 to remove batik library.

Here, I created it: #7969 (Also happy to create the PR for it once this current PR is merged.)

@matthiasblaesingmatthiasblaesing left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks sane. Thanks again.

@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

Thanks for reviewing! Squashing the changes into a single commit before merging.

Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

ci:dev-build[ci] produce a dev-build zip artifact (7 days expiration, see link on workflow summary page)Platform[ci] enable platform tests (platform/*)UIUser Interface

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants

@eirikbakke@matthiasblaesing@mbien
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Add copy buttons to all
 blocks\n(function() {\n function addCopyButtons() {\n document.querySelectorAll('pre code').forEach(function(codeBlock) {\n if (codeBlock.parentElement.hasAttribute('data-copy-added')) return;\n codeBlock.parentElement.setAttribute('data-copy-added', 'true');\n \n var btn = document.createElement('button');\n btn.textContent = 'Copy';\n btn.style.cssText = 'position:absolute;top:4px;right:4px;padding:2px 8px;font-size:11px;background:#4ecdc4;border:none;border-radius:4px;color:#1a1a2e;cursor:pointer;opacity:0.7;transition:opacity 0.2s;';\n btn.onmouseover = function() { this.style.opacity = '1'; };\n btn.onmouseout = function() { this.style.opacity = '0.7'; };\n btn.onclick = function() {\n navigator.clipboard.writeText(codeBlock.textContent).then(function() {\n btn.textContent = 'Copied!';\n setTimeout(function() { btn.textContent = 'Copy'; }, 1500);\n });\n };\n codeBlock.parentElement.style.position = 'relative';\n codeBlock.parentElement.appendChild(btn);\n });\n }\n \n addCopyButtons();\n \n // Re-run on dynamic content\n var observer = new MutationObserver(addCopyButtons);\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Add Copy Buttons to Code Blocks");
}
} catch(__e) { console.warn('[Userscript:Add Copy Buttons to Code Blocks]', __e); }
})();
(function(){
try {
var __m = "github.com";
var __re = new RegExp('^' + "github\\.com" + '
Skip to content

Switch SVG loading from the Batik library to JSVG - #7941

Merged
eirikbakke merged 1 commit into
apache:masterfrom
eirikbakke:pr-jsvg
Nov 16, 2024
Merged

Switch SVG loading from the Batik library to JSVG#7941
eirikbakke merged 1 commit into
apache:masterfrom
eirikbakke:pr-jsvg

Conversation

@eirikbakke

Copy link
Copy Markdown
Contributor

Per our discussion in #7463 (comment) and #7938 , here is a PR that switches SVG loading routine in ImageUtilities from the Batik library to the much more lightweight JSVG library.

It's a draft that needs more testing, so I have added the do-not-merge label for now. But I'm leaving the work here since it might benefit #7938.

@eirikbakkeeirikbakke added do not merge Don't merge this PR, it is not ready or just demonstration purposes. Platform [ci] enable platform tests (platform/*) UI User Interface labels Nov 7, 2024
@eirikbakkeeirikbakke mentioned this pull request Nov 7, 2024
@matthiasblaesing

Copy link
Copy Markdown
Contributor

For testing the rendering you render render all svgs both with batik and jsvg and diff the two.

@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

There's a lot of bugs that can happen in the full application context, rather than in an isolated script, so I prefer to test the full app. (Dimensions, hints, HiDPI scaling, ImageProducer/ImageObserver/ColorModel stuff, caching etc.)

@matthiasblaesing

Copy link
Copy Markdown
Contributor

There's a lot of bugs that can happen in the full application context, rather than in an isolated script, so I prefer to test the full app. (Dimensions, hints, HiDPI scaling, ImageProducer/ImageObserver/ColorModel stuff, caching etc.)

Sure, it was an idea and could catch the most obvious problem.

@eirikbakke
eirikbakkeforce-pushed the pr-jsvg branch 5 times, most recently from 8110b4c to 0fa8094CompareNovember 7, 2024 21:43
@mbienmbien added the ci:dev-build [ci] produce a dev-build zip artifact (7 days expiration, see link on workflow summary page) label Nov 7, 2024
@eirikbakke
eirikbakkeforce-pushed the pr-jsvg branch 2 times, most recently from d510758 to 136a6a9CompareNovember 8, 2024 00:04
@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

Sorry for all the force-pushes... I was fidgeting to get the "paperwork" test to pass.

@mbien

mbien commented Nov 9, 2024

Copy link
Copy Markdown
Member

Sorry for all the force-pushes... I was fidgeting to get the "paperwork" test to pass.

no worries, thats what CI is for.

same comparison as in #7463 (comment)

svg-icons_impl_comparison

batik is on the left, jsvg on the right (I think). I can't tell the difference - so its either not working or it works perfectly ;)

@matthiasblaesing

Copy link
Copy Markdown
Contributor

First impression is good. I rebuild my "work" NetBeans with this applied and did not notice a difference.

@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

Yes, looks rather identical. Just to verify that the JSVG library is actually being used, I inserted a drawLine right after the call to com.github.weisj.jsvg.SVGDocument.renderWithPlatform. Confirmed:

image

Note that the PR does not actually remove the platform/libs.batik.read module, just the dependency on it from platform/openide.util.ui.svg . Removing the batik library entirely could be done separately if desired.

@eirikbakke

eirikbakke commented Nov 9, 2024

Copy link
Copy Markdown
ContributorAuthor

I do see some cases where the icons for Undo, Redo, and Quick Search appear with the right shape, but a black fill, even though other icons look fine. Then in another case they looked OK. Will require some more investigation.

image

@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

OK, the "black shapes" problem was only with some older SVG files that we no longer use. They were generated using a now-deprecated setting in Adobe Illustrator.

(Full details: The problem occurred only on an my private build of NetBeans, which had some older versions of the SVG files that were generated with other Adobe Illustrator settings. All of those SVG files were regenerated in #7463, and replaced with versions that appear to work with JSVG. The README file merged in apache/netbeans-tools#67 lists the correct settings to use when generating SVGs from Adobe Illustrator. I filed an issue at weisJ/jsvg#96 to document the all-black icon issue, but it's not actually a problem for us as SVG files are now generated in a different way, and the setting that caused problems is now deprecated in Adobe Illustrator anyway.)

@eirikbakkeeirikbakke removed the do not merge Don't merge this PR, it is not ready or just demonstration purposes. label Nov 9, 2024
@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

I have now tested the patch on a build of master, in my working IDE (which is a private build based on NetBeans 22), and in my NetBeans Platform application (which has a bunch of additional icons beyond those in the IDE). The rendering seems to be entirely equivalent to Batik for our particular SVG files.

I think the PR is ready for review now, so I remove the do-not-merge label.

@matthiasblaesingmatthiasblaesing left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Minimal nitpick, apart from these this looks good to me. Thank you.

I think it would be good to create an issue with target NB25 to remove batik library. It makes no sense to ship a library we don't use, on the other hand I think it would be good to give this some time in master before removing batik.

@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

I think it would be good to create an issue with target NB25 to remove batik library.

Here, I created it: #7969 (Also happy to create the PR for it once this current PR is merged.)

@matthiasblaesingmatthiasblaesing left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks sane. Thanks again.

@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

Thanks for reviewing! Squashing the changes into a single commit before merging.

Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

ci:dev-build[ci] produce a dev-build zip artifact (7 days expiration, see link on workflow summary page)Platform[ci] enable platform tests (platform/*)UIUser Interface

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants

@eirikbakke@matthiasblaesing@mbien
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Force GitHub README to respect dark mode\n(function() {\n var style = document.createElement('style');\n style.textContent = '\n .markdown-body {\n color-scheme: dark light;\n }\n .markdown-body pre { background: #161b22 !important; }\n .markdown-body code { background: rgba(110, 118, 129, 0.4) !important; }\n .markdown-body table th, .markdown-body table td { border-color: #30363d !important; }\n .markdown-body img { background: #0d1117; }\n .markdown-body blockquote { border-left-color: #8b949e; }\n .markdown-body hr { border-color: #30363d; }\n ';\n document.head.appendChild(style);\n})();", "GitHub Dark Mode README Fix"); } } catch(__e) { console.warn('[Userscript:GitHub Dark Mode README Fix]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content

Switch SVG loading from the Batik library to JSVG - #7941

Merged
eirikbakke merged 1 commit into
apache:masterfrom
eirikbakke:pr-jsvg
Nov 16, 2024
Merged

Switch SVG loading from the Batik library to JSVG#7941
eirikbakke merged 1 commit into
apache:masterfrom
eirikbakke:pr-jsvg

Conversation

@eirikbakke

Copy link
Copy Markdown
Contributor

Per our discussion in #7463 (comment) and #7938 , here is a PR that switches SVG loading routine in ImageUtilities from the Batik library to the much more lightweight JSVG library.

It's a draft that needs more testing, so I have added the do-not-merge label for now. But I'm leaving the work here since it might benefit #7938.

@eirikbakkeeirikbakke added do not merge Don't merge this PR, it is not ready or just demonstration purposes. Platform [ci] enable platform tests (platform/*) UI User Interface labels Nov 7, 2024
@eirikbakkeeirikbakke mentioned this pull request Nov 7, 2024
@matthiasblaesing

Copy link
Copy Markdown
Contributor

For testing the rendering you render render all svgs both with batik and jsvg and diff the two.

@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

There's a lot of bugs that can happen in the full application context, rather than in an isolated script, so I prefer to test the full app. (Dimensions, hints, HiDPI scaling, ImageProducer/ImageObserver/ColorModel stuff, caching etc.)

@matthiasblaesing

Copy link
Copy Markdown
Contributor

There's a lot of bugs that can happen in the full application context, rather than in an isolated script, so I prefer to test the full app. (Dimensions, hints, HiDPI scaling, ImageProducer/ImageObserver/ColorModel stuff, caching etc.)

Sure, it was an idea and could catch the most obvious problem.

@eirikbakke
eirikbakkeforce-pushed the pr-jsvg branch 5 times, most recently from 8110b4c to 0fa8094CompareNovember 7, 2024 21:43
@mbienmbien added the ci:dev-build [ci] produce a dev-build zip artifact (7 days expiration, see link on workflow summary page) label Nov 7, 2024
@eirikbakke
eirikbakkeforce-pushed the pr-jsvg branch 2 times, most recently from d510758 to 136a6a9CompareNovember 8, 2024 00:04
@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

Sorry for all the force-pushes... I was fidgeting to get the "paperwork" test to pass.

@mbien

mbien commented Nov 9, 2024

Copy link
Copy Markdown
Member

Sorry for all the force-pushes... I was fidgeting to get the "paperwork" test to pass.

no worries, thats what CI is for.

same comparison as in #7463 (comment)

svg-icons_impl_comparison

batik is on the left, jsvg on the right (I think). I can't tell the difference - so its either not working or it works perfectly ;)

@matthiasblaesing

Copy link
Copy Markdown
Contributor

First impression is good. I rebuild my "work" NetBeans with this applied and did not notice a difference.

@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

Yes, looks rather identical. Just to verify that the JSVG library is actually being used, I inserted a drawLine right after the call to com.github.weisj.jsvg.SVGDocument.renderWithPlatform. Confirmed:

image

Note that the PR does not actually remove the platform/libs.batik.read module, just the dependency on it from platform/openide.util.ui.svg . Removing the batik library entirely could be done separately if desired.

@eirikbakke

eirikbakke commented Nov 9, 2024

Copy link
Copy Markdown
ContributorAuthor

I do see some cases where the icons for Undo, Redo, and Quick Search appear with the right shape, but a black fill, even though other icons look fine. Then in another case they looked OK. Will require some more investigation.

image

@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

OK, the "black shapes" problem was only with some older SVG files that we no longer use. They were generated using a now-deprecated setting in Adobe Illustrator.

(Full details: The problem occurred only on an my private build of NetBeans, which had some older versions of the SVG files that were generated with other Adobe Illustrator settings. All of those SVG files were regenerated in #7463, and replaced with versions that appear to work with JSVG. The README file merged in apache/netbeans-tools#67 lists the correct settings to use when generating SVGs from Adobe Illustrator. I filed an issue at weisJ/jsvg#96 to document the all-black icon issue, but it's not actually a problem for us as SVG files are now generated in a different way, and the setting that caused problems is now deprecated in Adobe Illustrator anyway.)

@eirikbakkeeirikbakke removed the do not merge Don't merge this PR, it is not ready or just demonstration purposes. label Nov 9, 2024
@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

I have now tested the patch on a build of master, in my working IDE (which is a private build based on NetBeans 22), and in my NetBeans Platform application (which has a bunch of additional icons beyond those in the IDE). The rendering seems to be entirely equivalent to Batik for our particular SVG files.

I think the PR is ready for review now, so I remove the do-not-merge label.

@matthiasblaesingmatthiasblaesing left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Minimal nitpick, apart from these this looks good to me. Thank you.

I think it would be good to create an issue with target NB25 to remove batik library. It makes no sense to ship a library we don't use, on the other hand I think it would be good to give this some time in master before removing batik.

@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

I think it would be good to create an issue with target NB25 to remove batik library.

Here, I created it: #7969 (Also happy to create the PR for it once this current PR is merged.)

@matthiasblaesingmatthiasblaesing left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks sane. Thanks again.

@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

Thanks for reviewing! Squashing the changes into a single commit before merging.

Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

ci:dev-build[ci] produce a dev-build zip artifact (7 days expiration, see link on workflow summary page)Platform[ci] enable platform tests (platform/*)UIUser Interface

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants

@eirikbakke@matthiasblaesing@mbien
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Highlight search terms from Google/DuckDuckGo/Bing referrer\n(function() {\n var ref = document.referrer;\n var terms = [];\n \n if (ref.includes('google.com') || ref.includes('duckduckgo.com') || ref.includes('bing.com')) {\n var url = new URL(ref);\n var q = url.searchParams.get('q') || url.searchParams.get('p');\n if (q) {\n terms = q.split(/\\s+/).filter(function(t) { return t.length > 2; });\n }\n }\n \n if (terms.length === 0) return;\n \n var style = document.createElement('style');\n style.textContent = '.userscript-highlight { background: #fbbf24; color: #1a1a2e; padding: 1px 3px; border-radius: 2px; }';\n document.head.appendChild(style);\n \n function highlight(node) {\n if (node.nodeType === 3) { // text node\n var text = node.textContent;\n var found = false;\n terms.forEach(function(term) {\n var regex = new RegExp('(' + term.replace(/[.*+?^${}()|[\\]\\\\]/g, '\\\\') + ')', 'gi');\n if (regex.test(text)) {\n found = true;\n var frag = document.createDocumentFragment();\n var parts = text.split(regex);\n parts.forEach(function(part, i) {\n if (i % 2 === 0) {\n frag.appendChild(document.createTextNode(part));\n } else {\n var span = document.createElement('span');\n span.className = 'userscript-highlight';\n span.textContent = part;\n frag.appendChild(span);\n }\n });\n node.parentNode.replaceChild(frag, node);\n }\n });\n } else if (node.nodeType === 1 && node.childNodes) { // element\n var skipTags = ['SCRIPT', 'STYLE', 'NOSCRIPT', 'TEXTAREA', 'INPUT', 'SELECT'];\n if (!skipTags.includes(node.tagName)) {\n Array.from(node.childNodes).forEach(highlight);\n }\n }\n }\n \n highlight(document.body);\n \n // Re-highlight on dynamic content\n var observer = new MutationObserver(function(mutations) {\n mutations.forEach(function(m) {\n m.addedNodes.forEach(function(node) {\n if (node.nodeType === 1 || node.nodeType === 3) highlight(node);\n });\n });\n });\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Highlight Search Terms"); } } catch(__e) { console.warn('[Userscript:Highlight Search Terms]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content

Switch SVG loading from the Batik library to JSVG - #7941

Merged
eirikbakke merged 1 commit into
apache:masterfrom
eirikbakke:pr-jsvg
Nov 16, 2024
Merged

Switch SVG loading from the Batik library to JSVG#7941
eirikbakke merged 1 commit into
apache:masterfrom
eirikbakke:pr-jsvg

Conversation

@eirikbakke

Copy link
Copy Markdown
Contributor

Per our discussion in #7463 (comment) and #7938 , here is a PR that switches SVG loading routine in ImageUtilities from the Batik library to the much more lightweight JSVG library.

It's a draft that needs more testing, so I have added the do-not-merge label for now. But I'm leaving the work here since it might benefit #7938.

@eirikbakkeeirikbakke added do not merge Don't merge this PR, it is not ready or just demonstration purposes. Platform [ci] enable platform tests (platform/*) UI User Interface labels Nov 7, 2024
@eirikbakkeeirikbakke mentioned this pull request Nov 7, 2024
@matthiasblaesing

Copy link
Copy Markdown
Contributor

For testing the rendering you render render all svgs both with batik and jsvg and diff the two.

@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

There's a lot of bugs that can happen in the full application context, rather than in an isolated script, so I prefer to test the full app. (Dimensions, hints, HiDPI scaling, ImageProducer/ImageObserver/ColorModel stuff, caching etc.)

@matthiasblaesing

Copy link
Copy Markdown
Contributor

There's a lot of bugs that can happen in the full application context, rather than in an isolated script, so I prefer to test the full app. (Dimensions, hints, HiDPI scaling, ImageProducer/ImageObserver/ColorModel stuff, caching etc.)

Sure, it was an idea and could catch the most obvious problem.

@eirikbakke
eirikbakkeforce-pushed the pr-jsvg branch 5 times, most recently from 8110b4c to 0fa8094CompareNovember 7, 2024 21:43
@mbienmbien added the ci:dev-build [ci] produce a dev-build zip artifact (7 days expiration, see link on workflow summary page) label Nov 7, 2024
@eirikbakke
eirikbakkeforce-pushed the pr-jsvg branch 2 times, most recently from d510758 to 136a6a9CompareNovember 8, 2024 00:04
@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

Sorry for all the force-pushes... I was fidgeting to get the "paperwork" test to pass.

@mbien

mbien commented Nov 9, 2024

Copy link
Copy Markdown
Member

Sorry for all the force-pushes... I was fidgeting to get the "paperwork" test to pass.

no worries, thats what CI is for.

same comparison as in #7463 (comment)

svg-icons_impl_comparison

batik is on the left, jsvg on the right (I think). I can't tell the difference - so its either not working or it works perfectly ;)

@matthiasblaesing

Copy link
Copy Markdown
Contributor

First impression is good. I rebuild my "work" NetBeans with this applied and did not notice a difference.

@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

Yes, looks rather identical. Just to verify that the JSVG library is actually being used, I inserted a drawLine right after the call to com.github.weisj.jsvg.SVGDocument.renderWithPlatform. Confirmed:

image

Note that the PR does not actually remove the platform/libs.batik.read module, just the dependency on it from platform/openide.util.ui.svg . Removing the batik library entirely could be done separately if desired.

@eirikbakke

eirikbakke commented Nov 9, 2024

Copy link
Copy Markdown
ContributorAuthor

I do see some cases where the icons for Undo, Redo, and Quick Search appear with the right shape, but a black fill, even though other icons look fine. Then in another case they looked OK. Will require some more investigation.

image

@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

OK, the "black shapes" problem was only with some older SVG files that we no longer use. They were generated using a now-deprecated setting in Adobe Illustrator.

(Full details: The problem occurred only on an my private build of NetBeans, which had some older versions of the SVG files that were generated with other Adobe Illustrator settings. All of those SVG files were regenerated in #7463, and replaced with versions that appear to work with JSVG. The README file merged in apache/netbeans-tools#67 lists the correct settings to use when generating SVGs from Adobe Illustrator. I filed an issue at weisJ/jsvg#96 to document the all-black icon issue, but it's not actually a problem for us as SVG files are now generated in a different way, and the setting that caused problems is now deprecated in Adobe Illustrator anyway.)

@eirikbakkeeirikbakke removed the do not merge Don't merge this PR, it is not ready or just demonstration purposes. label Nov 9, 2024
@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

I have now tested the patch on a build of master, in my working IDE (which is a private build based on NetBeans 22), and in my NetBeans Platform application (which has a bunch of additional icons beyond those in the IDE). The rendering seems to be entirely equivalent to Batik for our particular SVG files.

I think the PR is ready for review now, so I remove the do-not-merge label.

@matthiasblaesingmatthiasblaesing left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Minimal nitpick, apart from these this looks good to me. Thank you.

I think it would be good to create an issue with target NB25 to remove batik library. It makes no sense to ship a library we don't use, on the other hand I think it would be good to give this some time in master before removing batik.

@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

I think it would be good to create an issue with target NB25 to remove batik library.

Here, I created it: #7969 (Also happy to create the PR for it once this current PR is merged.)

@matthiasblaesingmatthiasblaesing left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks sane. Thanks again.

@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

Thanks for reviewing! Squashing the changes into a single commit before merging.

Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

ci:dev-build[ci] produce a dev-build zip artifact (7 days expiration, see link on workflow summary page)Platform[ci] enable platform tests (platform/*)UIUser Interface

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants

@eirikbakke@matthiasblaesing@mbien
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Strip utm_, fbclid, gclid, etc. from all links on page\n(function() {\n var trackingParams = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_term', 'utm_content',\n 'fbclid', 'gclid', 'dclid', 'msclkid', 'yclid',\n 'ref', 'ref_src', 'source', 'medium', 'campaign'];\n \n function cleanUrl(url) {\n try {\n var u = new URL(url, window.location.origin);\n var changed = false;\n trackingParams.forEach(function(p) {\n if (u.searchParams.has(p)) {\n u.searchParams.delete(p);\n changed = true;\n }\n });\n return changed ? u.toString() : url;\n } catch (e) {\n return url;\n }\n }\n \n function cleanLinks() {\n document.querySelectorAll('a[href]').forEach(function(a) {\n var clean = cleanUrl(a.href);\n if (clean !== a.href) a.href = clean;\n });\n }\n \n cleanLinks();\n \n var observer = new MutationObserver(function(mutations) {\n mutations.forEach(function(m) {\n m.addedNodes.forEach(function(node) {\n if (node.nodeType === 1) {\n if (node.tagName === 'A') cleanLinks();\n node.querySelectorAll('a[href]').forEach(function(a) {\n var clean = cleanUrl(a.href);\n if (clean !== a.href) a.href = clean;\n });\n }\n });\n });\n });\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Remove Tracking Parameters from Links"); } } catch(__e) { console.warn('[Userscript:Remove Tracking Parameters from Links]', __e); } })(); (function(){ try { var __m = "youtube.com"; var __re = new RegExp('^' + "youtube\\.com" + '
Skip to content

Switch SVG loading from the Batik library to JSVG - #7941

Merged
eirikbakke merged 1 commit into
apache:masterfrom
eirikbakke:pr-jsvg
Nov 16, 2024
Merged

Switch SVG loading from the Batik library to JSVG#7941
eirikbakke merged 1 commit into
apache:masterfrom
eirikbakke:pr-jsvg

Conversation

@eirikbakke

Copy link
Copy Markdown
Contributor

Per our discussion in #7463 (comment) and #7938 , here is a PR that switches SVG loading routine in ImageUtilities from the Batik library to the much more lightweight JSVG library.

It's a draft that needs more testing, so I have added the do-not-merge label for now. But I'm leaving the work here since it might benefit #7938.

@eirikbakkeeirikbakke added do not merge Don't merge this PR, it is not ready or just demonstration purposes. Platform [ci] enable platform tests (platform/*) UI User Interface labels Nov 7, 2024
@eirikbakkeeirikbakke mentioned this pull request Nov 7, 2024
@matthiasblaesing

Copy link
Copy Markdown
Contributor

For testing the rendering you render render all svgs both with batik and jsvg and diff the two.

@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

There's a lot of bugs that can happen in the full application context, rather than in an isolated script, so I prefer to test the full app. (Dimensions, hints, HiDPI scaling, ImageProducer/ImageObserver/ColorModel stuff, caching etc.)

@matthiasblaesing

Copy link
Copy Markdown
Contributor

There's a lot of bugs that can happen in the full application context, rather than in an isolated script, so I prefer to test the full app. (Dimensions, hints, HiDPI scaling, ImageProducer/ImageObserver/ColorModel stuff, caching etc.)

Sure, it was an idea and could catch the most obvious problem.

@eirikbakke
eirikbakkeforce-pushed the pr-jsvg branch 5 times, most recently from 8110b4c to 0fa8094CompareNovember 7, 2024 21:43
@mbienmbien added the ci:dev-build [ci] produce a dev-build zip artifact (7 days expiration, see link on workflow summary page) label Nov 7, 2024
@eirikbakke
eirikbakkeforce-pushed the pr-jsvg branch 2 times, most recently from d510758 to 136a6a9CompareNovember 8, 2024 00:04
@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

Sorry for all the force-pushes... I was fidgeting to get the "paperwork" test to pass.

@mbien

mbien commented Nov 9, 2024

Copy link
Copy Markdown
Member

Sorry for all the force-pushes... I was fidgeting to get the "paperwork" test to pass.

no worries, thats what CI is for.

same comparison as in #7463 (comment)

svg-icons_impl_comparison

batik is on the left, jsvg on the right (I think). I can't tell the difference - so its either not working or it works perfectly ;)

@matthiasblaesing

Copy link
Copy Markdown
Contributor

First impression is good. I rebuild my "work" NetBeans with this applied and did not notice a difference.

@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

Yes, looks rather identical. Just to verify that the JSVG library is actually being used, I inserted a drawLine right after the call to com.github.weisj.jsvg.SVGDocument.renderWithPlatform. Confirmed:

image

Note that the PR does not actually remove the platform/libs.batik.read module, just the dependency on it from platform/openide.util.ui.svg . Removing the batik library entirely could be done separately if desired.

@eirikbakke

eirikbakke commented Nov 9, 2024

Copy link
Copy Markdown
ContributorAuthor

I do see some cases where the icons for Undo, Redo, and Quick Search appear with the right shape, but a black fill, even though other icons look fine. Then in another case they looked OK. Will require some more investigation.

image

@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

OK, the "black shapes" problem was only with some older SVG files that we no longer use. They were generated using a now-deprecated setting in Adobe Illustrator.

(Full details: The problem occurred only on an my private build of NetBeans, which had some older versions of the SVG files that were generated with other Adobe Illustrator settings. All of those SVG files were regenerated in #7463, and replaced with versions that appear to work with JSVG. The README file merged in apache/netbeans-tools#67 lists the correct settings to use when generating SVGs from Adobe Illustrator. I filed an issue at weisJ/jsvg#96 to document the all-black icon issue, but it's not actually a problem for us as SVG files are now generated in a different way, and the setting that caused problems is now deprecated in Adobe Illustrator anyway.)

@eirikbakkeeirikbakke removed the do not merge Don't merge this PR, it is not ready or just demonstration purposes. label Nov 9, 2024
@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

I have now tested the patch on a build of master, in my working IDE (which is a private build based on NetBeans 22), and in my NetBeans Platform application (which has a bunch of additional icons beyond those in the IDE). The rendering seems to be entirely equivalent to Batik for our particular SVG files.

I think the PR is ready for review now, so I remove the do-not-merge label.

@matthiasblaesingmatthiasblaesing left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Minimal nitpick, apart from these this looks good to me. Thank you.

I think it would be good to create an issue with target NB25 to remove batik library. It makes no sense to ship a library we don't use, on the other hand I think it would be good to give this some time in master before removing batik.

@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

I think it would be good to create an issue with target NB25 to remove batik library.

Here, I created it: #7969 (Also happy to create the PR for it once this current PR is merged.)

@matthiasblaesingmatthiasblaesing left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks sane. Thanks again.

@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

Thanks for reviewing! Squashing the changes into a single commit before merging.

Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

ci:dev-build[ci] produce a dev-build zip artifact (7 days expiration, see link on workflow summary page)Platform[ci] enable platform tests (platform/*)UIUser Interface

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants

@eirikbakke@matthiasblaesing@mbien
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Auto-enable theater mode on YouTube\n(function() {\n function tryTheater() {\n var btn = document.querySelector('button[aria-label=\"Theater mode\"], ytd-player #player button[title=\"Theater mode\"]');\n if (btn && !btn.classList.contains('activated')) {\n btn.click();\n }\n }\n \n // Try immediately\n tryTheater();\n \n // Try after navigation (SPA)\n var lastUrl = location.href;\n setInterval(function() {\n if (location.href !== lastUrl) {\n lastUrl = location.href;\n setTimeout(tryTheater, 500);\n }\n }, 1000);\n \n // Also try on player load\n var observer = new MutationObserver(tryTheater);\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "YouTube Theater Mode Default"); } } catch(__e) { console.warn('[Userscript:YouTube Theater Mode Default]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content

Switch SVG loading from the Batik library to JSVG - #7941

Merged
eirikbakke merged 1 commit into
apache:masterfrom
eirikbakke:pr-jsvg
Nov 16, 2024
Merged

Switch SVG loading from the Batik library to JSVG#7941
eirikbakke merged 1 commit into
apache:masterfrom
eirikbakke:pr-jsvg

Conversation

@eirikbakke

Copy link
Copy Markdown
Contributor

Per our discussion in #7463 (comment) and #7938 , here is a PR that switches SVG loading routine in ImageUtilities from the Batik library to the much more lightweight JSVG library.

It's a draft that needs more testing, so I have added the do-not-merge label for now. But I'm leaving the work here since it might benefit #7938.

@eirikbakkeeirikbakke added do not merge Don't merge this PR, it is not ready or just demonstration purposes. Platform [ci] enable platform tests (platform/*) UI User Interface labels Nov 7, 2024
@eirikbakkeeirikbakke mentioned this pull request Nov 7, 2024
@matthiasblaesing

Copy link
Copy Markdown
Contributor

For testing the rendering you render render all svgs both with batik and jsvg and diff the two.

@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

There's a lot of bugs that can happen in the full application context, rather than in an isolated script, so I prefer to test the full app. (Dimensions, hints, HiDPI scaling, ImageProducer/ImageObserver/ColorModel stuff, caching etc.)

@matthiasblaesing

Copy link
Copy Markdown
Contributor

There's a lot of bugs that can happen in the full application context, rather than in an isolated script, so I prefer to test the full app. (Dimensions, hints, HiDPI scaling, ImageProducer/ImageObserver/ColorModel stuff, caching etc.)

Sure, it was an idea and could catch the most obvious problem.

@eirikbakke
eirikbakkeforce-pushed the pr-jsvg branch 5 times, most recently from 8110b4c to 0fa8094CompareNovember 7, 2024 21:43
@mbienmbien added the ci:dev-build [ci] produce a dev-build zip artifact (7 days expiration, see link on workflow summary page) label Nov 7, 2024
@eirikbakke
eirikbakkeforce-pushed the pr-jsvg branch 2 times, most recently from d510758 to 136a6a9CompareNovember 8, 2024 00:04
@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

Sorry for all the force-pushes... I was fidgeting to get the "paperwork" test to pass.

@mbien

mbien commented Nov 9, 2024

Copy link
Copy Markdown
Member

Sorry for all the force-pushes... I was fidgeting to get the "paperwork" test to pass.

no worries, thats what CI is for.

same comparison as in #7463 (comment)

svg-icons_impl_comparison

batik is on the left, jsvg on the right (I think). I can't tell the difference - so its either not working or it works perfectly ;)

@matthiasblaesing

Copy link
Copy Markdown
Contributor

First impression is good. I rebuild my "work" NetBeans with this applied and did not notice a difference.

@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

Yes, looks rather identical. Just to verify that the JSVG library is actually being used, I inserted a drawLine right after the call to com.github.weisj.jsvg.SVGDocument.renderWithPlatform. Confirmed:

image

Note that the PR does not actually remove the platform/libs.batik.read module, just the dependency on it from platform/openide.util.ui.svg . Removing the batik library entirely could be done separately if desired.

@eirikbakke

eirikbakke commented Nov 9, 2024

Copy link
Copy Markdown
ContributorAuthor

I do see some cases where the icons for Undo, Redo, and Quick Search appear with the right shape, but a black fill, even though other icons look fine. Then in another case they looked OK. Will require some more investigation.

image

@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

OK, the "black shapes" problem was only with some older SVG files that we no longer use. They were generated using a now-deprecated setting in Adobe Illustrator.

(Full details: The problem occurred only on an my private build of NetBeans, which had some older versions of the SVG files that were generated with other Adobe Illustrator settings. All of those SVG files were regenerated in #7463, and replaced with versions that appear to work with JSVG. The README file merged in apache/netbeans-tools#67 lists the correct settings to use when generating SVGs from Adobe Illustrator. I filed an issue at weisJ/jsvg#96 to document the all-black icon issue, but it's not actually a problem for us as SVG files are now generated in a different way, and the setting that caused problems is now deprecated in Adobe Illustrator anyway.)

@eirikbakkeeirikbakke removed the do not merge Don't merge this PR, it is not ready or just demonstration purposes. label Nov 9, 2024
@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

I have now tested the patch on a build of master, in my working IDE (which is a private build based on NetBeans 22), and in my NetBeans Platform application (which has a bunch of additional icons beyond those in the IDE). The rendering seems to be entirely equivalent to Batik for our particular SVG files.

I think the PR is ready for review now, so I remove the do-not-merge label.

@matthiasblaesingmatthiasblaesing left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Minimal nitpick, apart from these this looks good to me. Thank you.

I think it would be good to create an issue with target NB25 to remove batik library. It makes no sense to ship a library we don't use, on the other hand I think it would be good to give this some time in master before removing batik.

@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

I think it would be good to create an issue with target NB25 to remove batik library.

Here, I created it: #7969 (Also happy to create the PR for it once this current PR is merged.)

@matthiasblaesingmatthiasblaesing left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks sane. Thanks again.

@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

Thanks for reviewing! Squashing the changes into a single commit before merging.

Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

ci:dev-build[ci] produce a dev-build zip artifact (7 days expiration, see link on workflow summary page)Platform[ci] enable platform tests (platform/*)UIUser Interface

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants

@eirikbakke@matthiasblaesing@mbien
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Remove or un-stick sticky/fixed headers that block content\n(function() {\n function unstick() {\n document.querySelectorAll('header, nav, [role=\"banner\"], .header, .navbar, .sticky, .fixed-top, [style*=\"position: fixed\"], [style*=\"position:sticky\"]').forEach(function(el) {\n if (el.style.position === 'fixed' || el.style.position === 'sticky' || \n getComputedStyle(el).position === 'fixed' || getComputedStyle(el).position === 'sticky') {\n el.style.position = 'static';\n el.style.top = 'auto';\n el.style.zIndex = 'auto';\n }\n });\n }\n \n unstick();\n \n var observer = new MutationObserver(unstick);\n observer.observe(document.body, { childList: true, subtree: true, attributes: true, attributeFilter: ['style', 'class'] });\n})();", "Kill Sticky Headers"); } } catch(__e) { console.warn('[Userscript:Kill Sticky Headers]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content

Switch SVG loading from the Batik library to JSVG - #7941

Merged
eirikbakke merged 1 commit into
apache:masterfrom
eirikbakke:pr-jsvg
Nov 16, 2024
Merged

Switch SVG loading from the Batik library to JSVG#7941
eirikbakke merged 1 commit into
apache:masterfrom
eirikbakke:pr-jsvg

Conversation

@eirikbakke

Copy link
Copy Markdown
Contributor

Per our discussion in #7463 (comment) and #7938 , here is a PR that switches SVG loading routine in ImageUtilities from the Batik library to the much more lightweight JSVG library.

It's a draft that needs more testing, so I have added the do-not-merge label for now. But I'm leaving the work here since it might benefit #7938.

@eirikbakkeeirikbakke added do not merge Don't merge this PR, it is not ready or just demonstration purposes. Platform [ci] enable platform tests (platform/*) UI User Interface labels Nov 7, 2024
@eirikbakkeeirikbakke mentioned this pull request Nov 7, 2024
@matthiasblaesing

Copy link
Copy Markdown
Contributor

For testing the rendering you render render all svgs both with batik and jsvg and diff the two.

@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

There's a lot of bugs that can happen in the full application context, rather than in an isolated script, so I prefer to test the full app. (Dimensions, hints, HiDPI scaling, ImageProducer/ImageObserver/ColorModel stuff, caching etc.)

@matthiasblaesing

Copy link
Copy Markdown
Contributor

There's a lot of bugs that can happen in the full application context, rather than in an isolated script, so I prefer to test the full app. (Dimensions, hints, HiDPI scaling, ImageProducer/ImageObserver/ColorModel stuff, caching etc.)

Sure, it was an idea and could catch the most obvious problem.

@eirikbakke
eirikbakkeforce-pushed the pr-jsvg branch 5 times, most recently from 8110b4c to 0fa8094CompareNovember 7, 2024 21:43
@mbienmbien added the ci:dev-build [ci] produce a dev-build zip artifact (7 days expiration, see link on workflow summary page) label Nov 7, 2024
@eirikbakke
eirikbakkeforce-pushed the pr-jsvg branch 2 times, most recently from d510758 to 136a6a9CompareNovember 8, 2024 00:04
@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

Sorry for all the force-pushes... I was fidgeting to get the "paperwork" test to pass.

@mbien

mbien commented Nov 9, 2024

Copy link
Copy Markdown
Member

Sorry for all the force-pushes... I was fidgeting to get the "paperwork" test to pass.

no worries, thats what CI is for.

same comparison as in #7463 (comment)

svg-icons_impl_comparison

batik is on the left, jsvg on the right (I think). I can't tell the difference - so its either not working or it works perfectly ;)

@matthiasblaesing

Copy link
Copy Markdown
Contributor

First impression is good. I rebuild my "work" NetBeans with this applied and did not notice a difference.

@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

Yes, looks rather identical. Just to verify that the JSVG library is actually being used, I inserted a drawLine right after the call to com.github.weisj.jsvg.SVGDocument.renderWithPlatform. Confirmed:

image

Note that the PR does not actually remove the platform/libs.batik.read module, just the dependency on it from platform/openide.util.ui.svg . Removing the batik library entirely could be done separately if desired.

@eirikbakke

eirikbakke commented Nov 9, 2024

Copy link
Copy Markdown
ContributorAuthor

I do see some cases where the icons for Undo, Redo, and Quick Search appear with the right shape, but a black fill, even though other icons look fine. Then in another case they looked OK. Will require some more investigation.

image

@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

OK, the "black shapes" problem was only with some older SVG files that we no longer use. They were generated using a now-deprecated setting in Adobe Illustrator.

(Full details: The problem occurred only on an my private build of NetBeans, which had some older versions of the SVG files that were generated with other Adobe Illustrator settings. All of those SVG files were regenerated in #7463, and replaced with versions that appear to work with JSVG. The README file merged in apache/netbeans-tools#67 lists the correct settings to use when generating SVGs from Adobe Illustrator. I filed an issue at weisJ/jsvg#96 to document the all-black icon issue, but it's not actually a problem for us as SVG files are now generated in a different way, and the setting that caused problems is now deprecated in Adobe Illustrator anyway.)

@eirikbakkeeirikbakke removed the do not merge Don't merge this PR, it is not ready or just demonstration purposes. label Nov 9, 2024
@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

I have now tested the patch on a build of master, in my working IDE (which is a private build based on NetBeans 22), and in my NetBeans Platform application (which has a bunch of additional icons beyond those in the IDE). The rendering seems to be entirely equivalent to Batik for our particular SVG files.

I think the PR is ready for review now, so I remove the do-not-merge label.

@matthiasblaesingmatthiasblaesing left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Minimal nitpick, apart from these this looks good to me. Thank you.

I think it would be good to create an issue with target NB25 to remove batik library. It makes no sense to ship a library we don't use, on the other hand I think it would be good to give this some time in master before removing batik.

@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

I think it would be good to create an issue with target NB25 to remove batik library.

Here, I created it: #7969 (Also happy to create the PR for it once this current PR is merged.)

@matthiasblaesingmatthiasblaesing left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks sane. Thanks again.

@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

Thanks for reviewing! Squashing the changes into a single commit before merging.

Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

ci:dev-build[ci] produce a dev-build zip artifact (7 days expiration, see link on workflow summary page)Platform[ci] enable platform tests (platform/*)UIUser Interface

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants

@eirikbakke@matthiasblaesing@mbien
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Universal Dark Mode - works on any site\n(function() {\n var enabled = true;\n \n function applyDarkMode() {\n if (!enabled) return;\n \n // Create style element if it doesn't exist\n var style = document.getElementById('universal-dark-mode-style');\n if (!style) {\n style = document.createElement('style');\n style.id = 'universal-dark-mode-style';\n document.head.appendChild(style);\n }\n \n // Dark mode CSS - inverts colors but preserves images/video\n style.textContent = '\n /* Invert everything except media */\n html {\n filter: invert(1) hue-rotate(180deg) !important;\n background: #1a1a2e !important;\n }\n \n /* Restore images, videos, iframes, canvas */\n img, video, iframe, canvas, svg, picture, [style*=\"background-image\"] {\n filter: invert(1) hue-rotate(180deg) !important;\n }\n \n /* Preserve specific elements that should not be inverted */\n .no-dark-mode, .no-dark-mode *,\n [data-theme=\"light\"], [data-theme=\"light\"],\n .ace_editor, .ace_editor *,\n .CodeMirror, .CodeMirror *,\n .monaco-editor, .monaco-editor *,\n .markdown-body pre, .markdown-body pre *,\n .highlight, .highlight *,\n pre code, pre code * {\n filter: none !important;\n }\n \n /* Fix common UI elements */\n .modal, .popup, .dropdown-menu, .tooltip, .popover {\n filter: invert(1) hue-rotate(180deg) !important;\n background: #2d2d44 !important;\n border-color: #444 !important;\n }\n \n /* Scrollbars */\n ::-webkit-scrollbar { background: #1a1a2e !important; }\n ::-webkit-scrollbar-thumb { background: #444 !important; }\n ::-webkit-scrollbar-thumb:hover { background: #555 !important; }\n \n /* Selection */\n ::selection { background: #4ecdc4 !important; color: #1a1a2e !important; }\n ::-moz-selection { background: #4ecdc4 !important; color: #1a1a2e !important; }\n ';\n }\n \n function removeDarkMode() {\n var style = document.getElementById('universal-dark-mode-style');\n if (style) style.remove();\n }\n \n // Toggle with Alt+Shift+D\n document.addEventListener('keydown', function(e) {\n if (e.altKey && e.shiftKey && e.key === 'D') {\n e.preventDefault();\n enabled = !enabled;\n if (enabled) {\n applyDarkMode();\n console.log('[Universal Dark Mode] Enabled');\n } else {\n removeDarkMode();\n console.log('[Universal Dark Mode] Disabled');\n }\n }\n });\n \n // Apply on load\n applyDarkMode();\n \n // Re-apply on dynamic content\n var observer = new MutationObserver(function(mutations) {\n if (enabled && !document.getElementById('universal-dark-mode-style')) {\n applyDarkMode();\n }\n });\n observer.observe(document.head, { childList: true });\n \n console.log('[Universal Dark Mode] Loaded - Press Alt+Shift+D to toggle');\n})();", "Universal Dark Mode"); } } catch(__e) { console.warn('[Userscript:Universal Dark Mode]', __e); } })(); })();
Skip to content

Switch SVG loading from the Batik library to JSVG - #7941

Merged
eirikbakke merged 1 commit into
apache:masterfrom
eirikbakke:pr-jsvg
Nov 16, 2024
Merged

Switch SVG loading from the Batik library to JSVG#7941
eirikbakke merged 1 commit into
apache:masterfrom
eirikbakke:pr-jsvg

Conversation

@eirikbakke

Copy link
Copy Markdown
Contributor

Per our discussion in #7463 (comment) and #7938 , here is a PR that switches SVG loading routine in ImageUtilities from the Batik library to the much more lightweight JSVG library.

It's a draft that needs more testing, so I have added the do-not-merge label for now. But I'm leaving the work here since it might benefit #7938.

@eirikbakkeeirikbakke added do not merge Don't merge this PR, it is not ready or just demonstration purposes. Platform [ci] enable platform tests (platform/*) UI User Interface labels Nov 7, 2024
@eirikbakkeeirikbakke mentioned this pull request Nov 7, 2024
@matthiasblaesing

Copy link
Copy Markdown
Contributor

For testing the rendering you render render all svgs both with batik and jsvg and diff the two.

@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

There's a lot of bugs that can happen in the full application context, rather than in an isolated script, so I prefer to test the full app. (Dimensions, hints, HiDPI scaling, ImageProducer/ImageObserver/ColorModel stuff, caching etc.)

@matthiasblaesing

Copy link
Copy Markdown
Contributor

There's a lot of bugs that can happen in the full application context, rather than in an isolated script, so I prefer to test the full app. (Dimensions, hints, HiDPI scaling, ImageProducer/ImageObserver/ColorModel stuff, caching etc.)

Sure, it was an idea and could catch the most obvious problem.

@eirikbakke
eirikbakkeforce-pushed the pr-jsvg branch 5 times, most recently from 8110b4c to 0fa8094CompareNovember 7, 2024 21:43
@mbienmbien added the ci:dev-build [ci] produce a dev-build zip artifact (7 days expiration, see link on workflow summary page) label Nov 7, 2024
@eirikbakke
eirikbakkeforce-pushed the pr-jsvg branch 2 times, most recently from d510758 to 136a6a9CompareNovember 8, 2024 00:04
@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

Sorry for all the force-pushes... I was fidgeting to get the "paperwork" test to pass.

@mbien

mbien commented Nov 9, 2024

Copy link
Copy Markdown
Member

Sorry for all the force-pushes... I was fidgeting to get the "paperwork" test to pass.

no worries, thats what CI is for.

same comparison as in #7463 (comment)

svg-icons_impl_comparison

batik is on the left, jsvg on the right (I think). I can't tell the difference - so its either not working or it works perfectly ;)

@matthiasblaesing

Copy link
Copy Markdown
Contributor

First impression is good. I rebuild my "work" NetBeans with this applied and did not notice a difference.

@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

Yes, looks rather identical. Just to verify that the JSVG library is actually being used, I inserted a drawLine right after the call to com.github.weisj.jsvg.SVGDocument.renderWithPlatform. Confirmed:

image

Note that the PR does not actually remove the platform/libs.batik.read module, just the dependency on it from platform/openide.util.ui.svg . Removing the batik library entirely could be done separately if desired.

@eirikbakke

eirikbakke commented Nov 9, 2024

Copy link
Copy Markdown
ContributorAuthor

I do see some cases where the icons for Undo, Redo, and Quick Search appear with the right shape, but a black fill, even though other icons look fine. Then in another case they looked OK. Will require some more investigation.

image

@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

OK, the "black shapes" problem was only with some older SVG files that we no longer use. They were generated using a now-deprecated setting in Adobe Illustrator.

(Full details: The problem occurred only on an my private build of NetBeans, which had some older versions of the SVG files that were generated with other Adobe Illustrator settings. All of those SVG files were regenerated in #7463, and replaced with versions that appear to work with JSVG. The README file merged in apache/netbeans-tools#67 lists the correct settings to use when generating SVGs from Adobe Illustrator. I filed an issue at weisJ/jsvg#96 to document the all-black icon issue, but it's not actually a problem for us as SVG files are now generated in a different way, and the setting that caused problems is now deprecated in Adobe Illustrator anyway.)

@eirikbakkeeirikbakke removed the do not merge Don't merge this PR, it is not ready or just demonstration purposes. label Nov 9, 2024
@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

I have now tested the patch on a build of master, in my working IDE (which is a private build based on NetBeans 22), and in my NetBeans Platform application (which has a bunch of additional icons beyond those in the IDE). The rendering seems to be entirely equivalent to Batik for our particular SVG files.

I think the PR is ready for review now, so I remove the do-not-merge label.

@matthiasblaesingmatthiasblaesing left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Minimal nitpick, apart from these this looks good to me. Thank you.

I think it would be good to create an issue with target NB25 to remove batik library. It makes no sense to ship a library we don't use, on the other hand I think it would be good to give this some time in master before removing batik.

@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

I think it would be good to create an issue with target NB25 to remove batik library.

Here, I created it: #7969 (Also happy to create the PR for it once this current PR is merged.)

@matthiasblaesingmatthiasblaesing left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks sane. Thanks again.

@eirikbakke

Copy link
Copy Markdown
ContributorAuthor

Thanks for reviewing! Squashing the changes into a single commit before merging.

Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

ci:dev-build[ci] produce a dev-build zip artifact (7 days expiration, see link on workflow summary page)Platform[ci] enable platform tests (platform/*)UIUser Interface

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants

@eirikbakke@matthiasblaesing@mbien