mirror of
https://github.com/material-components/material-web.git
synced 2024-10-27 06:04:44 +03:00
Textfield fix ie (#491)
* IE fixes for textfield * run formatter * update changelog
This commit is contained in:
parent
e93e16d73b
commit
2d43e4626d
@ -29,6 +29,7 @@ and this project adheres to [Semantic Versioning](http://semver.org/).
|
||||
|
||||
- `<mwc-drawer>` can now be used with Rollup (via version bump to pick up
|
||||
[WICG/inert#135](https://github.com/WICG/inert/pull/135)).
|
||||
- `<mwc-textfield>` and `<mwc-textarea>` can now have basic usability in IE.
|
||||
|
||||
|
||||
## [0.8.0] - 2019-09-03
|
||||
|
@ -19,6 +19,7 @@ import {characterCounter} from '@material/mwc-textfield/character-counter/mwc-ch
|
||||
import {TextFieldBase} from '@material/mwc-textfield/mwc-textfield-base.js';
|
||||
import {html, property, query} from 'lit-element';
|
||||
import {classMap} from 'lit-html/directives/class-map';
|
||||
import {ifDefined} from 'lit-html/directives/if-defined.js';
|
||||
|
||||
export {TextFieldType} from '@material/mwc-textfield/mwc-textfield-base.js';
|
||||
|
||||
@ -50,6 +51,8 @@ export abstract class TextAreaBase extends TextFieldBase {
|
||||
}
|
||||
|
||||
protected renderInput() {
|
||||
const maxOrUndef = this.maxLength === -1 ? undefined : this.maxLength;
|
||||
|
||||
return html`
|
||||
<textarea
|
||||
id="text-field"
|
||||
@ -60,7 +63,7 @@ export abstract class TextAreaBase extends TextFieldBase {
|
||||
?disabled="${this.disabled}"
|
||||
placeholder="${this.placeholder}"
|
||||
?required="${this.required}"
|
||||
maxlength="${this.maxLength}"
|
||||
maxlength="${ifDefined(maxOrUndef)}"
|
||||
@change="${this.handleInputChange}"
|
||||
@blur="${this.onInputBlur}">
|
||||
</textarea>`;
|
||||
|
@ -183,13 +183,13 @@ export abstract class TextFieldBase extends FormElement {
|
||||
nativeValidity: ValidityState) => Partial<ValidityState>)|null = null;
|
||||
|
||||
focus() {
|
||||
const focusEvt = new FocusEvent('focus');
|
||||
const focusEvt = new CustomEvent('focus');
|
||||
this.formElement.dispatchEvent(focusEvt);
|
||||
this.formElement.focus();
|
||||
}
|
||||
|
||||
blur() {
|
||||
const blurEvt = new FocusEvent('blur');
|
||||
const blurEvt = new CustomEvent('blur');
|
||||
this.formElement.dispatchEvent(blurEvt);
|
||||
this.formElement.blur();
|
||||
}
|
||||
@ -239,6 +239,8 @@ export abstract class TextFieldBase extends FormElement {
|
||||
}
|
||||
|
||||
protected renderInput() {
|
||||
const maxOrUndef = this.maxLength === -1 ? undefined : this.maxLength;
|
||||
|
||||
return html`
|
||||
<input
|
||||
id="text-field"
|
||||
@ -248,7 +250,7 @@ export abstract class TextFieldBase extends FormElement {
|
||||
?disabled="${this.disabled}"
|
||||
placeholder="${this.placeholder}"
|
||||
?required="${this.required}"
|
||||
maxlength="${this.maxLength}"
|
||||
maxlength="${ifDefined(maxOrUndef)}"
|
||||
pattern="${ifDefined(this.pattern ? this.pattern : undefined)}"
|
||||
min="${ifDefined(this.min === '' ? undefined : this.min as number)}"
|
||||
max="${ifDefined(this.max === '' ? undefined : this.max as number)}"
|
||||
|
@ -139,7 +139,7 @@ suite('mwc-textfield:', () => {
|
||||
|
||||
const transformFn =
|
||||
(value: string, vState: ValidityState): Partial<ValidityState> => {
|
||||
if (value.includes('dogs')) {
|
||||
if (value.indexOf('dogs') !== -1) {
|
||||
return {
|
||||
valid: true,
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user