Bug: Cannot destructure property 'name' of 'e.variables.find(...)' as it is undefined.
Alegiter opened this issue ยท 1 comments
Is there an existing issue for this?
- I have searched the existing issues
Is this a regression?
No
Current behavior
I have Angular 11 project. I've been using transloco-keys-mahager 2.6.0 for a while.
And faced with problem that was solved in 3.0.2.
I updated to latest (3.2.0).
Used FIND
And got:
TypeError: Cannot destructure property 'name' of 'e.variables.find(...)' as it is undefined.
at resolveMetadata (/home/vladimir/Projects/neos-ng-sorm-ui/node_modules/@ngneat/transloco-keys-manager/keys-builder/template/structural-directive.extractor.js:1:1833)
at traverse (/home/vladimir/Projects/neos-ng-sorm-ui/node_modules/@ngneat/transloco-keys-manager/keys-builder/template/structural-directive.extractor.js:1:599)
at structuralDirectiveExtractor (/home/vladimir/Projects/neos-ng-sorm-ui/node_modules/@ngneat/transloco-keys-manager/keys-builder/template/structural-directive.extractor.js:1:290)
at templateExtractor (/home/vladimir/Projects/neos-ng-sorm-ui/node_modules/@ngneat/transloco-keys-manager/keys-builder/template/index.js:1:967)
at inlineTemplateExtractor (/home/vladimir/Projects/neos-ng-sorm-ui/node_modules/@ngneat/transloco-keys-manager/keys-builder/typescript/inline-template.js:1:462)
at TSExtractor (/home/vladimir/Projects/neos-ng-sorm-ui/node_modules/@ngneat/transloco-keys-manager/keys-builder/typescript/index.js:1:1512)
at extractKeys (/home/vladimir/Projects/neos-ng-sorm-ui/node_modules/@ngneat/transloco-keys-manager/keys-builder/utils/extract-keys.js:1:1011)
at extractTSKeys (/home/vladimir/Projects/neos-ng-sorm-ui/node_modules/@ngneat/transloco-keys-manager/keys-builder/typescript/index.js:1:721)
at buildKeys (/home/vladimir/Projects/neos-ng-sorm-ui/node_modules/@ngneat/transloco-keys-manager/keys-builder/build-keys.js:1:364)
at findMissingKeys (/home/vladimir/Projects/neos-ng-sorm-ui/node_modules/@ngneat/transloco-keys-manager/keys-detective/index.js:1:867)
I checked versions from 3.0.0 to 3.2.0. All of them gave me this error.
Checked version 2.7.5. No error.
I found "@angular/compiler": "12.2.6" dependency in your package.json in versions 3.0.0+. And maybe it's related some how, because of my 11 version....
Expected behavior
transloco-keys-mahager 3+ version works in Angular 11 project
And maybe does not depend on Angular major version
Please provide a link to a minimal reproduction of the bug
Can't prove a link
Transloco Config
module.exports = {
rootTranslationsPath: 'assets/i18n/',
defaultLang: 'ru',
langs: ['ru', 'en'],
keysManager: {
defaultValue: '{{key}}',
replace: false,
unflat: false,
sort: true
},
scopedLibs: [...]
};
Debug Logs
๐ DEBUG - Config:
Default: {
input: [ 'app' ],
output: 'assets/i18n',
langs: [ 'en' ],
marker: 't',
sort: false,
defaultValue: undefined,
replace: false,
addMissingKeys: false,
emitErrorOnExtraKeys: false,
translationsPath: 'assets/i18n'
} +0ms
Transloco file: {
defaultValue: '{{key}}',
replace: false,
unflat: false,
sort: true,
translationsPath: 'assets/i18n/',
langs: [ 'ru', 'en' ]
} +5ms
Inline: { command: 'find' } +1ms
Merged: {
input: [ 'app' ],
output: 'assets/i18n',
langs: [ 'ru', 'en' ],
marker: 't',
sort: true,
defaultValue: '{{key}}',
replace: false,
addMissingKeys: false,
emitErrorOnExtraKeys: false,
translationsPath: 'assets/i18n/',
unflat: false,
command: 'find'
} +0ms
๐ DEBUG - Configuration Paths:
Input: [ '/home/vladimir/Projects/neos-ng-sorm-ui/src/app' ] +0ms
Output: '/home/vladimir/Projects/neos-ng-sorm-ui/src/assets/i18n' +0ms
Translations: '/home/vladimir/Projects/neos-ng-sorm-ui/src/assets/i18n' +0ms
...My scopes...
๐ต ๐ Starting Search For Missing Keys ๐ ๐ต
โ Extracting Template and Component Keys /home/vladimir/Projects/neos-ng-sorm-ui/node_modules/@ngneat/transloco-keys-manager/keys-builder/template/structural-directive.extractor.js:1
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.traverse=exports.structuralDirectiveExtractor=void 0;const compiler_1=require("@angular/compiler"),add_key_1=require("../add-key"),resolvers_utils_1=require("../utils/resolvers.utils"),utils_1=require("./utils");function structuralDirectiveExtractor(e){traverse((0,utils_1.parseTemplate)(e).nodes,[],e)}function traverse(e,t,s){for(const r of e){let e=[];if((0,utils_1.isBoundText)(r)){const{expressions:s}=r.value.ast;e=getMethodUsages(s,t)}else if((0,utils_1.isSupportedNode)(r,[utils_1.isTemplate,utils_1.isElement])){if(isTranslocoTemplate(r))for(const e of resolveMetadata(r))t.push(e);e=getMethodUsages(r.inputs.map((e=>{const{ast:t}=e.value;return(0,utils_1.isInterpolation)(t)?t.expressions:t})).flat(),t),traverse(r.children,t,s)}addKeysFromAst(e,s)}}exports.structuralDirectiveExtractor=structuralDirectiveExtractor,exports.traverse=traverse;class MethodCallUnwrapper extends compiler_1.RecursiveAstVisitor{constructor(){super(...arguments),this.expressions=[]}visitMethodCall(e,t){this.expressions.push(e),super.visitMethodCall(e,t)}}function unwrapMethodCalls(e){const t=new MethodCallUnwrapper;return t.visit(e),t.expressions}function getMethodUsages(e,t){return e.flatMap(unwrapMethodCalls).filter((e=>isTranslocoMethod(e,t))).map((e=>Object.assign({exp:e.args[0]},t.find((({name:t,spanOffset:{start:s,end:r}})=>{const a=e.sourceSpan.end<r&&e.sourceSpan.start>s;return e.name===t&&a})))))}function isTranslocoAttr(e){return"transloco"===e.name}function isReadAttr(e){return"translocoRead"===e.name}function isTranslocoTemplate(e){return(0,utils_1.isTemplate)(e)&&(e.templateAttrs.some(isTranslocoAttr)||(0,utils_1.isNgTemplateTag)(e)&&e.attributes.some(isTranslocoAttr))}function isTranslocoMethod(e,t){return(0,utils_1.isMethodCall)(e)&&t.some((({name:t})=>t===e.name))}function resolveMetadata(e){var t,s,r,a;let i;if((0,utils_1.isNgTemplateTag)(e)){const a=e.variables.filter((e=>!e.value));let o=null===(t=e.attributes.find(isReadAttr))||void 0===t?void 0:t.value;if(!o){const t=null===(r=null===(s=e.inputs.find(isReadAttr))||void 0===s?void 0:s.value)||void 0===r?void 0:r.ast;(0,utils_1.isLiteralExpression)(t)&&(o=t.value)}i=a.map((({name:e})=>({name:e,read:o})))}else{const{name:t}=e.variables.find((e=>"$implicit"===e.value)),s=null===(a=e.templateAttrs.find(isReadAttr))||void 0===a?void 0:a.value;i=(0,utils_1.isLiteralExpression)(null==s?void 0:s.ast)?[{name:t,read:s.ast.value}]:[{name:t}]}return i.map((t=>{const s=e.sourceSpan;return Object.assign(Object.assign({},t),{spanOffset:{start:s.start.offset,end:s.end.offset}})}))}function addKeysFromAst(e,t){for(const{exp:s,read:r}of e)if((0,utils_1.isConditionalExpression)(s))for(const e of[s.trueExp,s.falseExp])addKeysFromAst([{exp:e,read:r}],t);else if((0,utils_1.isLiteralExpression)(s)&&s.value){let e=r?`${r}.${s.value}`:s.value;const[a,i]=(0,resolvers_utils_1.resolveAliasAndKey)(e,t.scopes);(0,add_key_1.addKey)(Object.assign(Object.assign({},t),{keyWithoutScope:a,scopeAlias:i}))}}
TypeError: Cannot destructure property 'name' of 'e.variables.find(...)' as it is undefined.
at resolveMetadata (/home/vladimir/Projects/neos-ng-sorm-ui/node_modules/@ngneat/transloco-keys-manager/keys-builder/template/structural-directive.extractor.js:1:2279)
at traverse (/home/vladimir/Projects/neos-ng-sorm-ui/node_modules/@ngneat/transloco-keys-manager/keys-builder/template/structural-directive.extractor.js:1:639)
at structuralDirectiveExtractor (/home/vladimir/Projects/neos-ng-sorm-ui/node_modules/@ngneat/transloco-keys-manager/keys-builder/template/structural-directive.extractor.js:1:330)
at templateExtractor (/home/vladimir/Projects/neos-ng-sorm-ui/node_modules/@ngneat/transloco-keys-manager/keys-builder/template/index.js:1:967)
at inlineTemplateExtractor (/home/vladimir/Projects/neos-ng-sorm-ui/node_modules/@ngneat/transloco-keys-manager/keys-builder/typescript/inline-template.js:1:462)
at TSExtractor (/home/vladimir/Projects/neos-ng-sorm-ui/node_modules/@ngneat/transloco-keys-manager/keys-builder/typescript/index.js:1:1512)
at extractKeys (/home/vladimir/Projects/neos-ng-sorm-ui/node_modules/@ngneat/transloco-keys-manager/keys-builder/utils/extract-keys.js:1:1011)
at extractTSKeys (/home/vladimir/Projects/neos-ng-sorm-ui/node_modules/@ngneat/transloco-keys-manager/keys-builder/typescript/index.js:1:721)
at buildKeys (/home/vladimir/Projects/neos-ng-sorm-ui/node_modules/@ngneat/transloco-keys-manager/keys-builder/build-keys.js:1:364)
at findMissingKeys (/home/vladimir/Projects/neos-ng-sorm-ui/node_modules/@ngneat/transloco-keys-manager/keys-detective/index.js:1:867)
Please provide the environment you discovered this bug in
Transloco: 2.23.3
Transloco Keys Manager: >=3.0.0
Angular: 11.0.3
Node: 12.18.1
Package Manager: npm 6.14.5
OS: Ubuntu 18.04.6 LTS
Additional context
No response
I would like to make a pull request for this bug
No
@Alegiter The reason that in v3, the keys manager depends on the Angular compiler is because of implementation changes within the library make it more stable by using AST instead of regexes which were hard to maintain.
You are welcome to investigate the issue and open a PR fix (if possible), but if you can't use the v3+, you are welcome to use v2+ until you upgrade to Angular v12+.
Of course, if this issue still occurs on Angular v12+, feel free to reopen ๐