Gutenberg: babel-plugin-makepot: Cannot read property 'end' of undefined

[manzoorwanijk]

Describe the bug
When creating a build, babel-plugin-makepot fails it with this error

Module build failed (from ./node_modules/babel-loader/lib/index.js):
TypeError: /src/index.js: Cannot read property 'end' of undefined
    at /mnt/d/test/node_modules/@wordpress/babel-plugin-makepot/build/index.js:145:32
    at arrayEach (/mnt/d/test/node_modules/lodash/lodash.js:516:11)
    at forEach (/mnt/d/test/node_modules/lodash/lodash.js:9342:14)
    at getExtractedComment (/mnt/d/test/node_modules/@wordpress/babel-plugin-makepot/build/index.js:144:3)
    at getExtractedComment (/mnt/d/test/node_modules/@wordpress/babel-plugin-makepot/build/index.js:175:12)
    at PluginPass.CallExpression (/mnt/d/test/node_modules/@wordpress/babel-plugin-makepot/build/index.js:290:26)

[kirilzh]

Hi @manzoorwanijk, if I understand correctly npm run build failed. I'm running

node v12.14.1
npm v6.13.4
branch: aa05f3611 (HEAD -> master, upstream/master) Add gradients support to Group, columns and media & text blocks (#21375)

and it passes correctly. Can you provide additional information with steps to reproduce?

[tarunparswani26]

Receiving the same error as specified by @manzoorwanijk while I'm trying to build the project using npm run build and the build process is failing.

Also, to give more insight on the error, it's pointing to a line of code that contains translations string __('Loading failed', 'plugin-domain'). If I comment this line of code, the build runs successfully.

Any thoughts on how to resolve the same.

[wvega]

It seems the error comes from this line:

https://github.com/WordPress/gutenberg/blob/2f832648001db19cae157ef4f07f39896fa6ee2a/packages/babel-plugin-makepot/src/index.js#L135

Although it looks like this in build/index.js:

    var line = commentNode.loc.end.line;

I get the same error while trying to build a block that uses @wordpress/babel-plugin-makepot:

Module build failed (from ./node_modules/babel-loader/lib/index.js):
TypeError: Cannot read property 'end' of undefined
    at /path/to/project/node_modules/@wordpress/babel-plugin-makepot/build/index.js:145:32
    at arrayEach (/path/to/project/node_modules/lodash/lodash.js:516:11)
    at forEach (/path/to/project/node_modules/lodash/lodash.js:9342:14)
    at getExtractedComment (/path/to/project/node_modules/@wordpress/babel-plugin-makepot/build/index.js:144:3)
    at getExtractedComment (/path/to/project/node_modules/@wordpress/babel-plugin-makepot/build/index.js:175:12)
    at PluginPass.CallExpression (/path/to/project/node_modules/@wordpress/babel-plugin-makepot/build/index.js:290:26)
    at newFn (/path/to/project/node_modules/@babel/traverse/lib/visitors.js:179:21)
    at NodePath._call (/path/to/project/node_modules/@babel/traverse/lib/path/context.js:55:20)
    at NodePath.call (/path/to/project/node_modules/@babel/traverse/lib/path/context.js:42:17)
    at NodePath.visit (/path/to/project/node_modules/@babel/traverse/lib/path/context.js:90:31)
    at TraversalContext.visitQueue (/path/to/project/node_modules/@babel/traverse/lib/context.js:112:16)
    at TraversalContext.visitMultiple (/path/to/project/node_modules/@babel/traverse/lib/context.js:79:17)
    at TraversalContext.visit (/path/to/project/node_modules/@babel/traverse/lib/context.js:138:19)
    at Function.traverse.node (/path/to/project/node_modules/@babel/traverse/lib/index.js:84:17)
    at NodePath.visit (/path/to/project/node_modules/@babel/traverse/lib/path/context.js:97:18)
    at TraversalContext.visitQueue (/path/to/project/node_modules/@babel/traverse/lib/context.js:112:16)

I'm guessing commentNode.loc is undefined at some point and triggers the error.

[unfulvio]

can confirm with @wvega above - we are working at the same project

replacing the affected lines from 3.5.0 build with:

    var line = null;

    if ( commentNode && commentNode.loc && commentNode.loc.end ) {
        line = commentNode.loc.end.line;
    }

seems to do the trick; the code picks up changes in the translatable strings correctly

probably you just need to adapt this sanity check in ES6 in src/index.js

[manzoorwanijk]

Any update on this?

[miya0001]

I opened a PR that has a patch as @unfulvio said and I could see it looks good to me.
https://github.com/WordPress/gutenberg/pull/22394

Thanks 😊