Skip to content

Commit d611bcb

Browse files
simonihmigsimonihmig
committed
Logic to skip/throw in native transform
1 parent 248076d commit d611bcb

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
@@ -312,78 +312,79 @@ describe('native components', function() {
312312

313313
expect(generateSnapshot(source, template)).toMatchSnapshot();
314314
});
315-
//
316-
//
317-
// test('skips tagless components', () => {
318-
// let source = `
319-
// export default Component.extend({
320-
// tagName: '',
321-
// });
322-
// `;
323-
//
324-
// let template = 'foo';
325-
//
326-
// let result = transform(source, template);
327-
// expect(result.tagName).toEqual(undefined);
328-
// expect(result.source).toEqual(source);
329-
// expect(result.template).toEqual(template);
330-
// });
331-
//
332-
// test('throws if component is using `this.element`', () => {
333-
// let source = `
334-
// export default Component.extend({
335-
// didInsertElement() {
336-
// console.log(this.element);
337-
// },
338-
// });
339-
// `;
340-
//
341-
// expect(() => transform(source, '')).toThrowErrorMatchingInlineSnapshot(
342-
// `"Using \`this.element\` is not supported in tagless components"`
343-
// );
344-
// });
345-
//
346-
// test('throws if component is using `this.elementId`', () => {
347-
// let source = `
348-
// export default Component.extend({
349-
// didInsertElement() {
350-
// console.log(this.elementId);
351-
// },
352-
// });
353-
// `;
354-
//
355-
// expect(() => transform(source, '')).toThrowErrorMatchingInlineSnapshot(
356-
// `"Using \`this.elementId\` is not supported in tagless components"`
357-
// );
358-
// });
359-
//
360-
// test('throws if component is using `keyDown()`', () => {
361-
// let source = `
362-
// export default Component.extend({
363-
// keyDown() {
364-
// console.log('Hello World!');
365-
// },
366-
// });
367-
// `;
368-
//
369-
// expect(() => transform(source, '')).toThrowErrorMatchingInlineSnapshot(
370-
// `"Using \`keyDown()\` is not supported in tagless components"`
371-
// );
372-
// });
373-
//
374-
// test('throws if component is using `click()`', () => {
375-
// let source = `
376-
// export default Component.extend({
377-
// click() {
378-
// console.log('Hello World!');
379-
// },
380-
// });
381-
// `;
382-
//
383-
// expect(() => transform(source, '')).toThrowErrorMatchingInlineSnapshot(
384-
// `"Using \`click()\` is not supported in tagless components"`
385-
// );
386-
// });
315+
316+
test('skips tagless components', () => {
317+
let source = `
318+
import { tagName } from '@ember-decorators/component';
319+
320+
@tagName('')
321+
export default class FooComponent extends Component {
322+
}
323+
`;
324+
325+
let template = 'foo';
326+
327+
let result = transform(source, template);
328+
expect(result.tagName).toEqual(undefined);
329+
expect(result.source).toEqual(source);
330+
expect(result.template).toEqual(template);
331+
});
332+
333+
test('throws if component is using `this.element`', () => {
334+
let source = `
335+
export default class FooComponent extends Component {
336+
didInsertElement() {
337+
console.log(this.element);
338+
}
339+
}
340+
`;
341+
342+
expect(() => transform(source, '')).toThrowErrorMatchingInlineSnapshot(
343+
`"Using \`this.element\` is not supported in tagless components"`
344+
);
345+
});
346+
347+
test('throws if component is using `this.elementId`', () => {
348+
let source = `
349+
export default class FooComponent extends Component {
350+
didInsertElement() {
351+
console.log(this.elementId);
352+
}
353+
}
354+
`;
355+
356+
expect(() => transform(source, '')).toThrowErrorMatchingInlineSnapshot(
357+
`"Using \`this.elementId\` is not supported in tagless components"`
358+
);
359+
});
360+
361+
test('throws if component is using `keyDown()`', () => {
362+
let source = `
363+
export default class FooComponent extends Component {
364+
keyDown() {
365+
console.log('Hello World!');
366+
}
367+
}
368+
`;
369+
370+
expect(() => transform(source, '')).toThrowErrorMatchingInlineSnapshot(
371+
`"Using \`keyDown()\` is not supported in tagless components"`
372+
);
373+
});
374+
375+
test('throws if component is using `click()`', () => {
376+
let source = `
377+
export default class FooComponent extends Component {
378+
click() {
379+
console.log('Hello World!');
380+
}
381+
}
382+
`;
383+
384+
expect(() => transform(source, '')).toThrowErrorMatchingInlineSnapshot(
385+
`"Using \`click()\` is not supported in tagless components"`
386+
);
387+
});
387388
//
388389
// test('multi-line template', () => {
389390
// 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)