chips: placeholder is truncated even though there is room for it in the component #10630
Comments
Hi has there been any progress on this issue? |
There has been progress, but no solution is available yet. I submitted PR #11098 which is needed before this issue can be solved, but it ran into some presubmit failures (breaking changes). I need to re-visit that PR, fix the issues, and re-submit. I don't have an ETA, but both chips and autocomplete are due for some fairly significant bug and a11y fixes in 1.1.10+. |
I was pretty confident in my approach in #11276 and we're testing it now internally. If you want me to get involved, let me know. Otherwise I'll patiently wait for the official fix :) |
@oliversalzburg thank you very much. I will review your suggestion and see if it can be used in the existing PR. I'll let you know how it goes. |
@Splaktar the fix suggested by @oliversalzburg works fine. There is a problem when the window is too small to fit the chips and the placeholder text. The placeholder text is not moved into a new line unless the window is small enough to show a substring containing only "Very Long Placeholder For". |
I recall that there were some keyboard/focus/a11y issues that needed to be solved beyond just those suggested changes. I need to dig into this again for sure. I've bumped the priority back up. |
Yeah, I think that fix mostly works now that the other fixes have landed. But the last issue is the one you mention here, if you add a long chip, or multiple chips, there are cases where the It seems like we need a I think that our best approach for solving this is to add an |
- add a new `md-input-class` to `<md-chips>` to `md-chips` and `md-contact-chips` - allows custom styling like adding a `min-width` for supporting very long placeholders - this is the same API as `<md-autocomplete>` already has - add demo of long `placeholder` and `md-input-class` Fixes #10630
- add a new `md-input-class` to `<md-chips>` to `md-chips` and `md-contact-chips` - allows custom styling like adding a `min-width` for supporting very long placeholders - this is the same API as `<md-autocomplete>` already has - add demo of long `placeholder` and `md-input-class` Fixes #10630
Actual Behavior:
What is the issue?*
Long placeholder on md-autocomplete is cut
What is the expected behavior?
Full placeholder should be seen
CodePen (or steps to reproduce the issue): *
CodePen Demo which shows your issue:
http://codepen.io/iverson4ever/pen/EmWZjd
Details:
Placeholder on HTML line 11
AngularJS Versions: *
AngularJS Version:
v1.5.5AngularJS Material Version:
v1.1.1Additional Information:
Browser Type: *
ChromeBrowser Version:*
58.0.3029.81 (64-bit)OS:*
Ubuntu 16.04Stack Traces:
The text was updated successfully, but these errors were encountered: