Skip to content

Commit 0b0226a

Browse files
simonihmigsimonihmig
committed
Logic to skip/throw in native transform
1 parent 703a3fa commit 0b0226a

3 files changed

Lines changed: 79 additions & 81 deletions

File tree

‎lib/__tests__/transform.js‎

Lines changed: 73 additions & 72 deletions
Original file line numberDiff line numberDiff line change
@@ -349,78 +349,79 @@ describe('native components', function() {
349349

350350
expect(generateSnapshot(source, template)).toMatchSnapshot();
351351
});
352-
//
353-
//
354-
// test('skips tagless components', () => {
355-
// let source = `
356-
// export default Component.extend({
357-
// tagName: '',
358-
// });
359-
// `;
360-
//
361-
// let template = 'foo';
362-
//
363-
// let result = transform(source, template);
364-
// expect(result.tagName).toEqual(undefined);
365-
// expect(result.source).toEqual(source);
366-
// expect(result.template).toEqual(template);
367-
// });
368-
//
369-
// test('throws if component is using `this.element`', () => {
370-
// let source = `
371-
// export default Component.extend({
372-
// didInsertElement() {
373-
// console.log(this.element);
374-
// },
375-
// });
376-
// `;
377-
//
378-
// expect(() => transform(source, '')).toThrowErrorMatchingInlineSnapshot(
379-
// `"Using \`this.element\` is not supported in tagless components"`
380-
// );
381-
// });
382-
//
383-
// test('throws if component is using `this.elementId`', () => {
384-
// let source = `
385-
// export default Component.extend({
386-
// didInsertElement() {
387-
// console.log(this.elementId);
388-
// },
389-
// });
390-
// `;
391-
//
392-
// expect(() => transform(source, '')).toThrowErrorMatchingInlineSnapshot(
393-
// `"Using \`this.elementId\` is not supported in tagless components"`
394-
// );
395-
// });
396-
//
397-
// test('throws if component is using `keyDown()`', () => {
398-
// let source = `
399-
// export default Component.extend({
400-
// keyDown() {
401-
// console.log('Hello World!');
402-
// },
403-
// });
404-
// `;
405-
//
406-
// expect(() => transform(source, '')).toThrowErrorMatchingInlineSnapshot(
407-
// `"Using \`keyDown()\` is not supported in tagless components"`
408-
// );
409-
// });
410-
//
411-
// test('throws if component is using `click()`', () => {
412-
// let source = `
413-
// export default Component.extend({
414-
// click() {
415-
// console.log('Hello World!');
416-
// },
417-
// });
418-
// `;
419-
//
420-
// expect(() => transform(source, '')).toThrowErrorMatchingInlineSnapshot(
421-
// `"Using \`click()\` is not supported in tagless components"`
422-
// );
423-
// });
352+
353+
test('skips tagless components', () => {
354+
let source = `
355+
import { tagName } from '@ember-decorators/component';
356+
357+
@tagName('')
358+
export default class FooComponent extends Component {
359+
}
360+
`;
361+
362+
let template = 'foo';
363+
364+
let result = transform(source, template);
365+
expect(result.tagName).toEqual(undefined);
366+
expect(result.source).toEqual(source);
367+
expect(result.template).toEqual(template);
368+
});
369+
370+
test('throws if component is using `this.element`', () => {
371+
let source = `
372+
export default class FooComponent extends Component {
373+
didInsertElement() {
374+
console.log(this.element);
375+
}
376+
}
377+
`;
378+
379+
expect(() => transform(source, '')).toThrowErrorMatchingInlineSnapshot(
380+
`"Using \`this.element\` is not supported in tagless components"`
381+
);
382+
});
383+
384+
test('throws if component is using `this.elementId`', () => {
385+
let source = `
386+
export default class FooComponent extends Component {
387+
didInsertElement() {
388+
console.log(this.elementId);
389+
}
390+
}
391+
`;
392+
393+
expect(() => transform(source, '')).toThrowErrorMatchingInlineSnapshot(
394+
`"Using \`this.elementId\` is not supported in tagless components"`
395+
);
396+
});
397+
398+
test('throws if component is using `keyDown()`', () => {
399+
let source = `
400+
export default class FooComponent extends Component {
401+
keyDown() {
402+
console.log('Hello World!');
403+
}
404+
}
405+
`;
406+
407+
expect(() => transform(source, '')).toThrowErrorMatchingInlineSnapshot(
408+
`"Using \`keyDown()\` is not supported in tagless components"`
409+
);
410+
});
411+
412+
test('throws if component is using `click()`', () => {
413+
let source = `
414+
export default class FooComponent extends Component {
415+
click() {
416+
console.log('Hello World!');
417+
}
418+
}
419+
`;
420+
421+
expect(() => transform(source, '')).toThrowErrorMatchingInlineSnapshot(
422+
`"Using \`click()\` is not supported in tagless components"`
423+
);
424+
});
424425
//
425426
// test('multi-line template', () => {
426427
// let source = `export default Component.extend({});`;

‎lib/transform/native.js‎

Lines changed: 5 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -85,9 +85,8 @@ module.exports = function transformNativeComponent(root, options) {
8585

8686
debug('tagName: %o', tagName);
8787

88-
/*
8988
// skip components that use `this.element`
90-
let thisElementPaths = j(objectArg).find(j.MemberExpression, {
89+
let thisElementPaths = j(classBody).find(j.MemberExpression, {
9190
object: { type: 'ThisExpression' },
9291
property: { name: 'element' },
9392
});
@@ -96,7 +95,7 @@ module.exports = function transformNativeComponent(root, options) {
9695
}
9796

9897
// skip components that use `this.elementId`
99-
let thisElementIdPaths = j(objectArg).find(j.MemberExpression, {
98+
let thisElementIdPaths = j(classBody).find(j.MemberExpression, {
10099
object: { type: 'ThisExpression' },
101100
property: { name: 'elementId' },
102101
});
@@ -106,12 +105,12 @@ module.exports = function transformNativeComponent(root, options) {
106105

107106
// skip components that use `click()` etc.
108107
for (let methodName of EVENT_HANDLER_METHODS) {
109-
let handlerMethod = properties.filter(path => isMethod(path, methodName))[0];
108+
let handlerMethod = classBody.filter(path => isMethod(path, methodName))[0];
110109
if (handlerMethod) {
111110
throw new SilentError(`Using \`${methodName}()\` is not supported in tagless components`);
112111
}
113112
}
114-
*/
113+
115114
// analyze `elementId`, `attributeBindings`, `classNames` and `classNameBindings`
116115
let elementId = findElementId(classBody);
117116
debug('elementId: %o', elementId);
@@ -143,9 +142,7 @@ module.exports = function transformNativeComponent(root, options) {
143142
j(classBody)
144143
.find(j.ClassProperty)
145144
// .filter(path => path.parentPath === properties)
146-
.filter(
147-
path => isProperty(path, 'elementId')
148-
)
145+
.filter(path => isProperty(path, 'elementId'))
149146
.remove();
150147

151148
removeDecorator(root, classDeclaration, 'attributeBindings', '@ember-decorators/component');

‎lib/utils/native.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,7 @@ function isProperty(path, name) {
3434

3535
function isMethod(path, name) {
3636
let node = path.value;
37-
return node.type === 'ObjectMethod' && node.key.type === 'Identifier' && node.key.name === name;
37+
return node.type === 'ClassMethod' && node.key.type === 'Identifier' && node.key.name === name;
3838
}
3939

4040
function findStringProperty(properties, name, defaultValue = null) {

0 commit comments

Comments
 (0)