CSP support

[wesleycho]

There has been a request for CSP support, and it seems like a reasonable feature request to split into a separate issue.

This needs to be investigated to see what changes would be needed to support this.

[RobJacobs]

There are a 3 other templates with anchor elements that have blank href attributes:

pagination/pager.html
pagination/pagination.html
tabs/tab.html

Not sure if that's legit or we should do the same on those templates.

[realityking]

Blank href's are generall fine. Only when they have interactive (link or button for example) children things may go south.

[RobJacobs]

So if I understand correctly, the preferred approach would be:

If the a element has a click handler, use:

<a href="#" ng-click="$event.preventDefault(); handler()"></a>

Otherwise use:

<a href ></a>

[realityking]

I'm actually not entirely sure about your first example (time for a plunkr?). But this is what I was talking about:

<a href="#" ng-click="$event.preventDefault()"><button ng-click="handler()"></button></a>

[RobJacobs]

This question comes from the recent commit @wesleycho made to make the accordion and typeahead CPS compliant. For the accordion group template, there is a handler on the ng-click and the end result now looks like so:

<a href="#" ng-click="$event.preventDefault(); toggleOpen()" ></a>

The typeahead-match was changed to look like so:

<a href="#" ng-click="$event.preventDefault()" ></a>

My confusion is, if there is no handler on the ng-click, would the correct fix for the typeahead-match be:

<a href ></a>

The reason I ask, the 3 templates I mentioned above have the anchor element as:

pagination/pager.html

<a href ng-click="selectPage(page - 1, $event)">

pagination/pagination.html

<a href ng-click="selectPage(1, $event)">

tabs/tab.html

<a href ng-click="select()" tab-heading-transclude>

Which seems to me to fall into the same scenario as the accordion-group. Or am I totally missing the point? I would just like to see this handled consistently...

[wesleycho]

Good catch @RobJacobs - I missed that particular resolution. I think I would lean towards the empty href solution for performance reasons

[RobJacobs]

I'm not sure what the best approach is, the javascript:void(0) was added to fix the issue discussed in #3911

[wesleycho]

I think we need to do ng-click="$event.preventDefault()" - see #3961.

[wesleycho]

I believe we are fine currently with this issue, feel free to bring up any other CSP issues in new issues.