Shadow DOM Emulation: two components in a template, the second does not get content projection

[jelbourn]

I have two components: MdButton and MdAnchor. Their selectors are [md-button]:not([href]) and [md-button][href], respectively. They both use the same template:

<link href="../button.css" rel="stylesheet">
<span class="md-button-wrapper"><content></content></span>

I have a demo where I render out some buttons and some anchors. It looks something like this:

<button md-button>BUTTON</button>
<a md-button href="http://google.com">ANCHOR</a>

Whichever component is second on the page does not receive content projection. Instead, the placeholder <script> tags are still there.

You can see this issue locally:

git fetch https://github.com/jelbourn/angular.git material-2
get checkout tags/projection-bug
npm install gulp-sass
npm install gulp-autoprefixer
gulp build.material
gulp serve.js.dev

Then visit http://localhost:8000/angular2/src/material/components/button/demo/?
You can see that the anchors do not have their content projected, while the buttons do. If you remove all of the buttons and leave only the anchors, they work fine. Re-add another button after the anchors, and then that button will have the problem.

[vsavkin]

I think since @tbosch and @yjbanov moved/moving shadow dom emulation into the render module, one of them should take look.

[jelbourn]

@mhevery this is still happening after the render layer changes from @tbosch. Who's the best person to take a look?

[mhevery]

@tbosch is still the person, if he is busy maybe @yjbanov can help (or even @vsavkin )

[jelbourn]

@tbosch Tried this just now on current master, the issue is still present.

[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.}