Fix ComponentServer relying on <style> tag to inject deps
The component server needs to inject CSS and JS scripts into each
example. It was doing this by relying on a <style> and <script> tag as
the hook to inject more code. But if you have an example without a
<style> or <script> tag, it won't work. Instead we now inject based on
the </head> and </body> tags, which will always exist (or, if they
don't, we have bigger problems!)
Bug: None
Change-Id: Id2f586c917ee7ab0821d5ab8e50e5cd3d3647a92
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2815131
Commit-Queue: Jack Franklin <jacktfranklin@chromium.org>
Commit-Queue: Tim van der Lippe <tvanderlippe@chromium.org>
Auto-Submit: Jack Franklin <jacktfranklin@chromium.org>
Reviewed-by: Tim van der Lippe <tvanderlippe@chromium.org>
diff --git a/scripts/component_server/server.js b/scripts/component_server/server.js
index 5473434..b09f977 100644
--- a/scripts/component_server/server.js
+++ b/scripts/component_server/server.js
@@ -248,8 +248,8 @@
path.join(baseUrlForSharedResource, 'front_end', 'ui', 'legacy', 'inspectorCommon.css')}" type="text/css" />`;
const toggleDarkModeScript = `<script type="module" src="${
path.join(baseUrlForSharedResource, 'front_end', 'component_docs', 'component_docs.js')}"></script>`;
- const newFileContents = fileContents.replace('<style>', `${themeColoursLink}\n${inspectorCommonLink}\n<style>`)
- .replace('<script', toggleDarkModeScript + '\n<script');
+ const newFileContents = fileContents.replace('</head>', `${themeColoursLink}\n${inspectorCommonLink}\n</head>`)
+ .replace('</body>', toggleDarkModeScript + '\n</body>');
respondWithHtml(response, newFileContents);
} else {