Unhelpful error message when Component is missing a selector

[jelbourn]

If you omit selector completely for a Component, you get

EXCEPTION: The selector "undefined" did not match any elements

If you use an empty string as a selector, you get an error in view_manager.js

EXCEPTION: TypeError: Cannot read property 'componentDirective' of undefined

Both of these cases should be captured by a single check that tells the user something like

Component "SourdoughBreadcrumbs" does not have a selector.

[btford]

Related to #2336.

[danrasmuson]

Question: How should we reference "SourdoughBreadcrumbs" in the error message? I imagine we would normally use the component selector however in this example it doesn't exist, right?

A generic error message might look like...

annotations_impl/annotations.ts

!isString(selector) ? throw makeTypeError('The component annotation requires a string selector'): null;

Give me your thoughts and I'll create a pull request and make some tests.

[pkozlowski-opensource]

@danielrasmuson we had some conversation about it in #3533 and it looks like TypeScript tape checking should take care of this for people using TS.

@mhevery I guess we still need a check inside ng2 for people using ES6 / ES5, right? If so I would be more happy to help out @danielrasmuson to prepare a PR

[mhevery]

Sure @danielrasmuson can send a PR.

[danrasmuson]

@pkozlowski-opensource I've started working on this but I have a few questions.

• Selectors that are not a string are invalid, correct?
• Selectors that are an empty string are invalid, correct?
• Should we validate the selector for special characters, '~!&*...'?
• Is not providing a selector valid? (See Feat: components without a selector #1662)

[pkozlowski-opensource]

@danielrasmuson empty, invalid or omitted selectors should throw. I would start simply and verify just those, we can add more checks (eg. special chars) later on.

[0x-r4bbit]

Doesn't that conflict with: #1662 ?

[pkozlowski-opensource]

@PascalPrecht @danielrasmuson yeh, thinking about it some more, I think that throwing in ViewMetadata is probably too early. We should only throw only when a selector of a given directive is being used.

The other case I can think of where an empty selector in ViewMetada might make sense is when we would like to have some conventions (ex. selector derived from a class name)

[danrasmuson]

@pkozlowski-opensource I've updated my pr with your feedback. It's only a couple lines. Your thoughts? #3759

[SonicGD]

There is some problem with selector validation:

Failed to execute 'querySelector' on 'Document': 'div[foo=123]' is not a valid selector.

It fails only if attribute value is int. String value is fine:

div[foo=bar] 

Check on alpha44

[vicb]

#3759 was trying to catch the error in the selector. However as discussed with @tbosch the check should be in the compiler.

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}