registerHelper breaks with Typescript 4.4

[Fadorico]

• Please don't open issues for security issues. Instead, file a report at https://www.npmjs.com/advisories/report?package=handlebars
• Have a look at https://github.com/wycats/handlebars.js/blob/master/CONTRIBUTING.md
• Read the FAQ at https://github.com/wycats/handlebars.js/blob/master/FAQ.md
• Use the jsfiddle-template at https://jsfiddle.net/4nbwjaqz/4/ to reproduce problems or bugs

Typescript 4.4 as recently introduced this breaking change: https://www.typescriptlang.org/docs/handbook/release-notes/typescript-4-4.html#more-compliant-indirect-calls-for-imported-functions

This change breaks the registerHelper function, and possibly other functions as well. Taking the following example code:

registerHelper('myHelper', function (value, options) {});

This gets transpiled into the following:

(0, handlebars_1.registerHelper)('myHelper', function (value, options) {});

Which causes the following error:

Cannot read property 'helpers' of undefined
at registerHelper ([...]/node_modules/handlebars/lib/handlebars/base.js:47:12)

This is using the current latest version of Handlebars (4.7.7) and Typescript 4.4.3

[nknapp]

Can you provide an example reproducing the bug? I mean a minimal but complete js-file, including the import?

Does it work when you do?

import Handlebars from 'handlebars'

Handlebars.registerHelper('...')

or

import * as Handlebars from 'handlebars'

Handlebars.registerHelper('...')

[Fadorico]

Both cases that you provided seem to work. The issue seems to only happen if you import it like so:
import { registerHelper } from 'handlebars';

Here's a minimal ts file that reproduces the problem:

import { registerHelper } from 'handlebars';

registerHelper('myHelper', function (value, options) {});

And here's the transpiled version of it

"use strict";

Object.defineProperty(exports, "__esModule", { value: true });

const handlebars_1 = require("handlebars");

(0, handlebars_1.registerHelper)('myHelper', function (value, options) { });

[webjoyable]

I have the same issue, with named import something breaks

handlebars@4.7.7
typescript@4.6.0

TypeError: Cannot read property 'helpers' of undefined at registerHelper ([...]\node_modules\handlebars\dist\cjs\handlebars\base.js:68:12)

[jaylinski]

As far as I can tell, the Handlebars-prototype functions (like registerHelper) should have never been exposed (exported) via .d.ts.

I will create a PR to fix those types.

Workaround: always use Handlebars (import Handlebars from 'handlebars') to access functions.

[carlos-reta]

I have similar issue when using typescript > 4.3.X

/Users/carlosreta/git/code-generator/test/uxf-seed/node_modules/handlebars/dist/cjs/handlebars/base.js:66
_utils.extend(this.helpers, name);
^

TypeError: Cannot read properties of undefined (reading 'helpers')
at registerHelper (/Users/carlosreta/git/code-generator/test/uxf-seed/node_modules/handlebars/dist/cjs/handlebars/base.js:66:26)
at registerComparisonHelpers (/Users/carlosreta/git/code-generator/test/uxf-seed/node_modules/@clx/uxf-code-generator/src/generators/register-helpers.js:16:37)
at registerHelpers (/Users/carlosreta/git/code-generator/test/uxf-seed/node_modules/@clx/uxf-code-generator/src/generators/register-helpers.js:93:5)
at Object. (/Users/carlosreta/git/code-generator/test/uxf-seed/node_modules/@clx/uxf-code-generator/src/index.js:79:40)
at Module._compile (node:internal/modules/cjs/loader:1105:14)
at Object.Module._extensions..js (node:internal/modules/cjs/loader:1159:10)
at Module.load (node:internal/modules/cjs/loader:981:32)
at Function.Module._load (node:internal/modules/cjs/loader:822:12)
at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:77:12)
at node:internal/main/run_main_module:17:47

With typescript 4.3.5 works but with typescript 4.6.2 f.ex. gives this error.

[bjornlll]

Workaround: always use Handlebars (import Handlebars from 'handlebars') to access functions.

Fixed it for me. Thanks @jaylinski !

Is this in the docs? If it isn't it should be. Took me 10 mins of random googling to figure this one out.

[jaylinski]

I opened a PR that adds an ESM example to the docs:

handlebars-lang/docs#128

Sadly I doesn't seem to be possible to write a TypeScript definition that forbids importing Handlebars like import { registerHelper } from 'handlebars'; while still being compatible with ESM and CommonJS. (At least I couldn't get it to work.)