[SSR]: Add server side rendering support for Nala components #943
Conversation
This file contains 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
fallaciousreasoning
requested review from
petemill and
AlanBreck
as code owners
|
👋 Thanks for Submitting! This PR is available for preview at the link below. ✅ PR tip preview: https://943.pr.nala.bravesoftware.com/ - ./tokens/css/variables-android.old.css: 7390 bytes
+ ./tokens/css/variables-android.css: 7390 bytes
---
- ./tokens/css/variables-browser.old.css: 6848 bytes
+ ./tokens/css/variables-browser.css: 6848 bytes
---
- ./tokens/css/variables-ios.old.css: 7033 bytes
+ ./tokens/css/variables-ios.css: 7033 bytes
---
- ./tokens/css/variables-marketing.old.css: 13501 bytes
+ ./tokens/css/variables-marketing.css: 13501 bytes
---
- ./tokens/css/variables-news.old.css: 526 bytes
+ ./tokens/css/variables-news.css: 526 bytes
---
- ./tokens/css/variables-newtab.old.css: 1933 bytes
+ ./tokens/css/variables-newtab.css: 1933 bytes
---
- ./tokens/css/variables-search.old.css: 2409 bytes
+ ./tokens/css/variables-search.css: 2409 bytes
---
- ./tokens/css/variables-web3.old.css: 905 bytes
+ ./tokens/css/variables-web3.css: 905 bytes
---
- ./tokens/css/variables.old.css: 119898 bytes
+ ./tokens/css/variables.css: 119898 bytes
Variables Diff: variables-android.diff--- ./tokens/css/variables-android.old.css 2024-12-16 02:48:05.110626623 +0000
+++ ./tokens/css/variables-android.css 2024-12-16 02:47:25.574868141 +0000
@@ -1,6 +1,6 @@
/**
* Do not edit directly
- * Generated on Fri Dec 13 2024 08:24:32 GMT+0000 (Coordinated Universal Time)
+ * Generated on Mon Dec 16 2024 02:47:25 GMT+0000 (Coordinated Universal Time)
*/
:root {
Variables Diff: variables-browser.diff--- ./tokens/css/variables-browser.old.css 2024-12-16 02:48:05.390624927 +0000
+++ ./tokens/css/variables-browser.css 2024-12-16 02:47:25.550868252 +0000
@@ -1,6 +1,6 @@
/**
* Do not edit directly
- * Generated on Fri Dec 13 2024 08:24:32 GMT+0000 (Coordinated Universal Time)
+ * Generated on Mon Dec 16 2024 02:47:25 GMT+0000 (Coordinated Universal Time)
*/
:root {
Variables Diff: variables-ios.diff--- ./tokens/css/variables-ios.old.css 2024-12-16 02:48:05.770622625 +0000
+++ ./tokens/css/variables-ios.css 2024-12-16 02:47:25.590868066 +0000
@@ -1,6 +1,6 @@
/**
* Do not edit directly
- * Generated on Fri Dec 13 2024 08:24:32 GMT+0000 (Coordinated Universal Time)
+ * Generated on Mon Dec 16 2024 02:47:25 GMT+0000 (Coordinated Universal Time)
*/
:root {
Variables Diff: variables-marketing.diff--- ./tokens/css/variables-marketing.old.css 2024-12-16 02:48:06.006621196 +0000
+++ ./tokens/css/variables-marketing.css 2024-12-16 02:47:25.614867954 +0000
@@ -1,6 +1,6 @@
/**
* Do not edit directly
- * Generated on Fri Dec 13 2024 08:24:32 GMT+0000 (Coordinated Universal Time)
+ * Generated on Mon Dec 16 2024 02:47:25 GMT+0000 (Coordinated Universal Time)
*/
:root {
Variables Diff: variables-news.diff--- ./tokens/css/variables-news.old.css 2024-12-16 02:48:06.290619474 +0000
+++ ./tokens/css/variables-news.css 2024-12-16 02:47:25.642867824 +0000
@@ -1,6 +1,6 @@
/**
* Do not edit directly
- * Generated on Fri Dec 13 2024 08:24:32 GMT+0000 (Coordinated Universal Time)
+ * Generated on Mon Dec 16 2024 02:47:25 GMT+0000 (Coordinated Universal Time)
*/
:root {
Variables Diff: variables-newtab.diff--- ./tokens/css/variables-newtab.old.css 2024-12-16 02:48:06.546617927 +0000
+++ ./tokens/css/variables-newtab.css 2024-12-16 02:47:25.650867787 +0000
@@ -1,6 +1,6 @@
/**
* Do not edit directly
- * Generated on Fri Dec 13 2024 08:24:32 GMT+0000 (Coordinated Universal Time)
+ * Generated on Mon Dec 16 2024 02:47:25 GMT+0000 (Coordinated Universal Time)
*/
:root {
Variables Diff: variables-search.diff--- ./tokens/css/variables-search.old.css 2024-12-16 02:48:06.778616519 +0000
+++ ./tokens/css/variables-search.css 2024-12-16 02:47:25.634867862 +0000
@@ -1,6 +1,6 @@
/**
* Do not edit directly
- * Generated on Fri Dec 13 2024 08:24:32 GMT+0000 (Coordinated Universal Time)
+ * Generated on Mon Dec 16 2024 02:47:25 GMT+0000 (Coordinated Universal Time)
*/
:root {
Variables Diff: variables-web3.diff--- ./tokens/css/variables-web3.old.css 2024-12-16 02:48:07.018615065 +0000
+++ ./tokens/css/variables-web3.css 2024-12-16 02:47:25.654867769 +0000
@@ -1,6 +1,6 @@
/**
* Do not edit directly
- * Generated on Fri Dec 13 2024 08:24:32 GMT+0000 (Coordinated Universal Time)
+ * Generated on Mon Dec 16 2024 02:47:25 GMT+0000 (Coordinated Universal Time)
*/
@media (prefers-color-scheme: light) {
Variables Diff: variables.diff--- ./tokens/css/variables.old.css 2024-12-16 02:48:07.378612885 +0000
+++ ./tokens/css/variables.css 2024-12-16 02:47:25.386869015 +0000
@@ -1,6 +1,6 @@
/**
* Do not edit directly
- * Generated on Fri Dec 13 2024 08:24:32 GMT+0000 (Coordinated Universal Time)
+ * Generated on Mon Dec 16 2024 02:47:25 GMT+0000 (Coordinated Universal Time)
*/
:root {
|
![github-actions[bot]](https://avatars.githubusercontent.com/in/15368?s=60&v=4){kind=small}
| await Promise.all(imports.map((init) => init())) | ||
|
|
||
| const document = globals.document | ||
| document.documentElement.innerHTML = html |
There was a problem hiding this comment.
reported by reviewdog 🐶
[semgrep] User controlled data in methods like innerHTML, outerHTML or document.write is an anti-pattern that can lead to XSS vulnerabilities
Source: https://semgrep.dev/r/javascript.browser.security.insecure-document-method.insecure-document-method
Cc @thypon @kdenhartog
There was a problem hiding this comment.
This is for SSR and not an issue
There was a problem hiding this comment.
How and where do we use SSR in Leo?
There was a problem hiding this comment.
We don't at the moment, because we don't support it - the idea here is that we can pass an html fragment to this render method and it will expand all the Leo web components so they can render on the client side without JavaScript (though they may not work until the JS loads)
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.
This will allow pages (such as https://brave.com) to use Nala components without needing to load JavaScript. This uses the Declarative Shadow Dom API which hit baseline this year (so is supported in all browsers).
^ the above page does not load any scripts at all! The
inputandbuttonelements work as is and after #942 lands thecheckboxwill too!