fix(cdk/overlay): support SVG element as overlay origin

[jpzwarte]

Currently when you provide an SVGElement when calling flexibleConnectedTo(...), it will not use the bounding client rect in the _getOriginRect() method, causing the overlay to appear at the top left of the viewport.

This 1-liner fixes that by checking whether origin is an instance of Element instead of HTMLElement. No other changes are required.

I looked at flexible-connected-position-strategy.spec.ts, but i didn't see an obvious place to add a test (i did not see any tests checking if specifiying an HTMLElement or ElementRef are supported either).

[googlebot]

We found a Contributor License Agreement for you (the sender of this pull request), but were unable to find agreements for all the commit author(s) or Co-authors. If you authored these, maybe you used a different email address in the git commits than was used to sign the CLA (login here to double check)? If these were authored by someone else, then they will need to sign a CLA as well, and confirm that they're okay with these being contributed to Google.
In order to pass this check, please resolve this problem and then comment @googlebot I fixed it.. If the bot doesn't comment, it means it doesn't think anything has changed.

ℹ️ Googlers: Go here for more info.

[jpzwarte]

@googlebot I fixed it.

[googlebot]

CLAs look good, thanks!

ℹ️ Googlers: Go here for more info.

[crisbeto]

We have some tests for using a point as an origin, so you should be able to copy and adjust those to cover an SVG element.

[crisbeto]

Good to go once the last comments are addressed.

[crisbeto]

LGTM

[jelbourn]

LGTM

[mirceapop89]

Any chance for this fix to be included in v7 or v8?

[jpzwarte]

Any chance for this fix to be included in v7 or v8?

Workaround is to pass an ElementRef as origin instead of an Element directly.

[mirceapop89]

Any chance for this fix to be included in v7 or v8?

Workaround is to pass an ElementRef as origin instead of an Element directly.

Ah great, thanks for the tip!

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