test: add to head page specific js and css

webdiscus · webdiscus · commit b79feaff684a · 2025-07-10T11:22:23.000+02:00
diff --git a/test/cases/_preprocessor/handlebars-page-specific-js-css/.editorconfig b/test/cases/_preprocessor/handlebars-page-specific-js-css/.editorconfig
@@ -0,0 +1,7 @@
+root = true
+
+[*.html]
+insert_final_newline = true
+
+[*.hbs]
+insert_final_newline = true
diff --git a/test/cases/_preprocessor/handlebars-page-specific-js-css/expected/about.html b/test/cases/_preprocessor/handlebars-page-specific-js-css/expected/about.html
@@ -0,0 +1,18 @@
+
+
+
+
+<html>
+  <head>
+    <title>About</title>
+      <link href="css/about.6551e7e5.css" rel="stylesheet">
+  <script src="js/about.e55bdc4a.js"></script>
+
+  </head>
+  <body>
+      <h1>About Page</h1>
+
+
+    <footer class='footer'>FOOTER</footer>
+  </body>
+</html>
diff --git a/test/cases/_preprocessor/handlebars-page-specific-js-css/expected/css/about.6551e7e5.css b/test/cases/_preprocessor/handlebars-page-specific-js-css/expected/css/about.6551e7e5.css
@@ -0,0 +1,3 @@
+h1 {
+  color: forestgreen;
+}
diff --git a/test/cases/_preprocessor/handlebars-page-specific-js-css/expected/css/home.a2c8ba2d.css b/test/cases/_preprocessor/handlebars-page-specific-js-css/expected/css/home.a2c8ba2d.css
@@ -0,0 +1,3 @@
+h1 {
+  color: orange;
+}
diff --git a/test/cases/_preprocessor/handlebars-page-specific-js-css/expected/index.html b/test/cases/_preprocessor/handlebars-page-specific-js-css/expected/index.html
@@ -0,0 +1,16 @@
+
+
+<html>
+  <head>
+    <title>Homepage</title>
+      <link href="css/home.a2c8ba2d.css" rel="stylesheet">
+  <script src="js/home.0132c52e.js"></script>
+
+  </head>
+  <body>
+      <h1>Home Page</h1>
+
+
+    <footer class='footer'>FOOTER</footer>
+  </body>
+</html>
diff --git a/test/cases/_preprocessor/handlebars-page-specific-js-css/expected/js/about.e55bdc4a.js b/test/cases/_preprocessor/handlebars-page-specific-js-css/expected/js/about.e55bdc4a.js
@@ -0,0 +1 @@
+console.log(">> about");
diff --git a/test/cases/_preprocessor/handlebars-page-specific-js-css/expected/js/home.0132c52e.js b/test/cases/_preprocessor/handlebars-page-specific-js-css/expected/js/home.0132c52e.js
@@ -0,0 +1 @@
+console.log(">> home");
diff --git a/test/cases/_preprocessor/handlebars-page-specific-js-css/src/views/pages/about/about.css b/test/cases/_preprocessor/handlebars-page-specific-js-css/src/views/pages/about/about.css
@@ -0,0 +1,3 @@
+h1 {
+  color: forestgreen;
+}
diff --git a/test/cases/_preprocessor/handlebars-page-specific-js-css/src/views/pages/about/about.js b/test/cases/_preprocessor/handlebars-page-specific-js-css/src/views/pages/about/about.js
@@ -0,0 +1 @@
+console.log('>> about');
diff --git a/test/cases/_preprocessor/handlebars-page-specific-js-css/src/views/pages/about/content.hbs b/test/cases/_preprocessor/handlebars-page-specific-js-css/src/views/pages/about/content.hbs
@@ -0,0 +1 @@
+<h1>About Page</h1>
diff --git a/test/cases/_preprocessor/handlebars-page-specific-js-css/src/views/pages/about/index.hbs b/test/cases/_preprocessor/handlebars-page-specific-js-css/src/views/pages/about/index.hbs
@@ -0,0 +1,12 @@
+{{assign title='About'}}
+
+{{#partial 'head'}}
+  <link href="./about.css" rel="stylesheet">
+  <script src="./about.js"></script>
+{{/partial}}
+
+{{#partial 'content'}}
+  {{> about/content}}
+{{/partial}}
+
+{{> layout}}
diff --git a/test/cases/_preprocessor/handlebars-page-specific-js-css/src/views/pages/home/content.hbs b/test/cases/_preprocessor/handlebars-page-specific-js-css/src/views/pages/home/content.hbs
@@ -0,0 +1 @@
+<h1>Home Page</h1>
diff --git a/test/cases/_preprocessor/handlebars-page-specific-js-css/src/views/pages/home/home.css b/test/cases/_preprocessor/handlebars-page-specific-js-css/src/views/pages/home/home.css
@@ -0,0 +1,3 @@
+h1 {
+  color: orange;
+}
diff --git a/test/cases/_preprocessor/handlebars-page-specific-js-css/src/views/pages/home/home.js b/test/cases/_preprocessor/handlebars-page-specific-js-css/src/views/pages/home/home.js
@@ -0,0 +1 @@
+console.log('>> home');
diff --git a/test/cases/_preprocessor/handlebars-page-specific-js-css/src/views/pages/home/index.hbs b/test/cases/_preprocessor/handlebars-page-specific-js-css/src/views/pages/home/index.hbs
@@ -0,0 +1,10 @@
+{{#partial 'head'}}
+  <link href="./home.css" rel="stylesheet">
+  <script src="./home.js"></script>
+{{/partial}}
+
+{{#partial 'content'}}
+  {{> home/content}}
+{{/partial}}
+
+{{> layout}}
diff --git a/test/cases/_preprocessor/handlebars-page-specific-js-css/src/views/partials/layout.hbs b/test/cases/_preprocessor/handlebars-page-specific-js-css/src/views/partials/layout.hbs
@@ -0,0 +1,11 @@
+<html>
+  <head>
+    <title>{{title}}</title>
+    {{#block 'head'}}{{/block}}
+  </head>
+  <body>
+    {{#block 'content'}}{{/block}}
+
+    <footer class='footer'>FOOTER</footer>
+  </body>
+</html>
diff --git a/test/cases/_preprocessor/handlebars-page-specific-js-css/webpack.config.js b/test/cases/_preprocessor/handlebars-page-specific-js-css/webpack.config.js
@@ -0,0 +1,45 @@
+const path = require('path');
+const HtmlBundlerPlugin = require('@test/html-bundler-webpack-plugin');
+
+const config = {
+  mode: 'production',
+  output: {
+    path: path.resolve(__dirname, './dist'),
+  },
+  plugins: [
+    new HtmlBundlerPlugin({
+      entry: {
+        index: {
+          import: './src/views/pages/home/index.hbs',
+          data: { title: 'Homepage' },
+        },
+        // test: the `title` is template defined using the `assign` helper
+        about: './src/views/pages/about/index.hbs',
+      },
+      js: {
+        filename: 'js/[name].[contenthash:8].js',
+      },
+      css: {
+        filename: 'css/[name].[contenthash:8].css',
+      },
+      preprocessor: 'handlebars',
+      preprocessorOptions: {
+        partials: [
+          // paths to partials used in page templates
+          path.join(__dirname, 'src/views/pages/'),
+          path.join(__dirname, 'src/views/partials/'),
+        ],
+      },
+    }),
+  ],
+  module: {
+    rules: [
+      {
+        test: /\.(css)$/,
+        use: ['css-loader'],
+      },
+    ],
+  },
+};
+
+module.exports = config;
diff --git a/test/preprocessor.test.js b/test/preprocessor.test.js
@@ -34,6 +34,7 @@ describe('handlebars', () => {
   test('option partials as array', () => compareFiles('_preprocessor/handlebars-option-partials-array'));
   test('option partials as object', () => compareFiles('_preprocessor/handlebars-option-partials-object'));
 
+  test('page specific js css', () => compareFiles('_preprocessor/handlebars-page-specific-js-css'));
   test('usage partials', () => compareFiles('_preprocessor/handlebars-option-partials-usage'));
   test('custom runtime', () => compareFiles('_preprocessor/handlebars-custom-runtime'));
 

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,3 @@`
	`1`	`+h1 {`
	`2`	`+ color: forestgreen;`
	`3`	`+}`