Components: md-form-field should not remove duplicate classes

Created on 30 Aug 2017  Â·  4Comments  Â·  Source: angular/components

Bug, feature request, or proposal:

Currently, md-form-field removes duplicate classes from itself.

What is the expected behavior?

The md-form-field should not edit/remove classes that have been set on the element.

What is the current behavior?

Currently any duplicate classes are reduced to a single instance of that class definition.

<md-form-field class="myClass myClass"></md-form-field>
<!--
  Becomes:
-->
<md-form-field class="myClass mat-input-container mat-form-field"></md-form-field>

What are the steps to reproduce?

Reproduction: http://plnkr.co/edit/fxxYGo?p=preview

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

IMO a component library should not dictate how the developer adds classes.

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

@angular/cli: 1.3.2
node: 8.0.0
os: darwin x64
@angular/cdk: 2.0.0-beta.10
@angular/animations: 4.3.6
@angular/cli: 1.3.2
@angular/common: 4.3.6
@angular/compiler: 4.3.6
@angular/compiler-cli: 4.3.6
@angular/core: 4.3.6
@angular/flex-layout: 2.0.0-beta.8
@angular/forms: 4.3.6
@angular/http: 4.3.6
@angular/material: 2.0.0-beta.10
@angular/platform-browser: 4.3.6
@angular/platform-browser-dynamic: 4.3.6
@angular/router: 4.3.6

All 4 comments

Also seen with MdSlider

http://plnkr.co/edit/zGMV79?p=preview

Probably a bug (?) in core, related to use of

@Component({
  // ...
  host: {
    'class': '...',
  }
})

For one, this isn't something in Material, it's most likely something from core, but I really don't see a case where keeping the duplicate classes makes sense. Angular most likely uses the native classList which also doesn't allow duplicates.

I wasn't aware that classList doesn't allow duplicates. That is unfortunate as there can be use-cases for duplicate classes and the browsers seem to handle it fine. ¯\_(ツ)_/¯

Thanks for the quick response.

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._

Was this page helpful?
0 / 5 - 0 ratings

Related issues

theunreal picture theunreal  Â·  3Comments

Miiekeee picture Miiekeee  Â·  3Comments

3mp3ri0r picture 3mp3ri0r  Â·  3Comments

julianobrasil picture julianobrasil  Â·  3Comments

RoxKilly picture RoxKilly  Â·  3Comments