test: add test for habdlebars helpers used in comple mode

test/cases/_preprocessor/js-tmpl-hbs-compile-helpers/src/app.hbs

@@ -1,2 +1,3 @@
-<p>Hello {{#bold}}{{helloName}}{{/bold}}!</p>
+{{#h1}}Header{{/h1}}
+<p>{{#italic}}Hello{{/italic}} {{#bold}}{{helloName}}{{/bold}}!</p>
 {{> 'footer'}}

test/cases/_preprocessor/js-tmpl-hbs-compile-helpers/src/helpers-esm/html-helpers.js

@@ -0,0 +1,10 @@
+//import Handlebars from 'handlebars'; // not works!
+const Handlebars = require('handlebars');
+
+export const h1 = function (options) {
+  return new Handlebars.SafeString(`<h1>${options.fn(this)}</h1>`);
+};
+
+export const italic = function (options) {
+  return new Handlebars.SafeString(`<i>${options.fn(this)}</i>`);
+};

test/cases/_preprocessor/js-tmpl-hbs-compile-helpers/webpack.config.js

@@ -1,6 +1,7 @@
 const path = require('path');
 const HtmlBundlerPlugin = require('@test/html-bundler-webpack-plugin');
 const Handlebars = require('handlebars');
+import { h1, italic } from './src/helpers-esm/html-helpers';
 
 module.exports = {
   mode: 'production',
@@ -23,12 +24,16 @@ module.exports = {
 
       preprocessor: 'handlebars',
       preprocessorOptions: {
-        //knownHelpersOnly: false,
-        // define helpers manually
+        // define helpers as an object
         helpers: {
           // WARNING: don't use the arrow function with `this` otherwise webpack compile `this` into `void 0`
           //bold: (options) => new Handlebars.SafeString(`<strong>${options.fn(this)}</strong>`),
 
+          // imported helpers
+          h1,
+          italic,
+
+          // helper defined as the function
           bold(options) {
             return new Handlebars.SafeString(`<strong>${options.fn(this)}</strong>`);
           },