diff --git a/CHANGELOG.md b/CHANGELOG.md index b14331ba73..3773be3aea 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -14,6 +14,8 @@ and this project adheres to [Semantic Versioning](http://semver.org/). - Buttons slotted into `` now render with correct default styles. Add `--mdc-snackbar-action-color` CSS custom property to override default action button color. +- Fix bug where `` `open` method threw if called immediately + after construction (before `firstUpdated`). ## [0.6.0] - 2019-06-05 - Upgrade lerna to 3.x diff --git a/packages/snackbar/src/mwc-snackbar-base.ts b/packages/snackbar/src/mwc-snackbar-base.ts index 40f75f8d77..a2dad52d40 100644 --- a/packages/snackbar/src/mwc-snackbar-base.ts +++ b/packages/snackbar/src/mwc-snackbar-base.ts @@ -52,6 +52,13 @@ export class SnackbarBase extends BaseElement { @property({type: Boolean}) leading = false; + /** + * We can't open the snackbar until the foundation is initialized, but that + * doesn't happen until firstUpdated. Keep track of early calls to open() and + * do so after we have a foundation. + */ + private _earlyOpen: boolean|undefined; + render() { const classes = { 'mdc-snackbar--stacked': this.stacked, @@ -107,11 +114,26 @@ export class SnackbarBase extends BaseElement { } open() { - this.mdcFoundation.open(); + if (this.mdcFoundation !== undefined) { + this.mdcFoundation.open(); + } else { + this._earlyOpen = true; + } } close(reason = '') { - this.mdcFoundation.close(reason); + if (this.mdcFoundation !== undefined) { + this.mdcFoundation.close(reason); + } else if (this._earlyOpen === true) { + this._earlyOpen = false; + } + } + + firstUpdated() { + super.firstUpdated(); + if (this._earlyOpen === true) { + this.mdcFoundation.open(); + } } _handleKeydown(e: KeyboardEvent) {