[MdSelect] - server side rendering crash

[jimjim2a]

Bug, feature request, or proposal:

MdSelect component has an issue on the _getTriggerRect method which basically calls browser nativeElement getBoundingClientRect method.

This can't work on node environment an make the app crash

What is the expected behavior?

The method should use the DomAdapter to make the getBoundingClientRect work on all platform. The other solution is to test if we are on browser or not and return a fallback object.

What is the current behavior?

The method calls the nativeElement getBoundingClientRect, this make the app crash.

What are the steps to reproduce?

What is the use-case or motivation for changing an existing behavior?

Make the MdSelect material component work on server

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

Angular 4.3.1
Material 2.0 beta 8
Typescript 2.3.3

Is there anything else we should know?

[crisbeto]

Interesting, we have a check for server-side rendering that is passing. Do you have a pre-assigned value to the select?

[jimjim2a]

Hi, yes exactly. More precisely the md-select is part of a reactive form, the pre-assigned value is filled with the FormControl applied on it. Sorry I should have precised it.

<md-select [formControl]="select">
    <md-option *ngFor="let label of choices; let key = index" [value]="key">{{ label }}</md-option>
</md-select>

And then the default value is filled using the setValue() method of the FormControl.

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