Amphtml: amp-lightbox: The back button closes the lightbox but not dispatch the lightboxClose event

Created on 7 Sep 2020  路  1Comment  路  Source: ampproject/amphtml

What's the issue?

The back button closes the lightbox but not dispatch the lightboxClose event

How do we reproduce the issue?

  1. Enter the example:
    https://amp.dev/documentation/examples/components/amp-lightbox/#combination-with-amp-bind

  2. Click Open Lightbox

  3. Click back button
  4. Click Open Lightbox again - It will stop working (because the back button don't dispatch the lightboxClose event

Or: https://playground.amp.dev/?format=websites&_gl=1m0r6kw_ga*YW1wLVZxQkVveWtIMElLbzVGWEpqNUdraXc.#share=PCEtLQogICMjIEludHJvZHVjdGlvbgoKICBUaGUgW2BhbXAtbGlnaHRib3hgXSgvY29udGVudC9hbXAtZGV2L2RvY3VtZW50YXRpb24vY29tcG9uZW50cy9yZWZlcmVuY2UvYW1wLWxpZ2h0Ym94LXYwLjEubWQpIGNvbXBvbmVudCBhbGxvd3MgZm9yIGEg4oCcbGlnaHRib3jigJ0gb3Igc2ltaWxhciBleHBlcmllbmNlIC0gd2hlcmUgdXBvbiB1c2VyIGludGVyYWN0aW9uIGEgY29tcG9uZW50IGV4cGFuZHMgdG8gZmlsbCB0aGUgdmlld3BvcnQsIHVudGlsIGl0IGlzIGNsb3NlZCBhZ2FpbiBieSB0aGUgdXNlci4KLS0+PCEtLSAtLT4KPCFkb2N0eXBlIGh0bWw+CjxodG1sIOKaoT4KPGhlYWQ+CjxtZXRhIGNoYXJzZXQ9InV0Zi04Ij4KICA8dGl0bGU+YW1wLWxpZ2h0Ym94PC90aXRsZT4KICA8c2NyaXB0IGFzeW5jIHNyYz0iaHR0cHM6Ly9jZG4uYW1wcHJvamVjdC5vcmcvdjAuanMiPjwvc2NyaXB0PgogIDwhLS0gIyMgU2V0dXAgLS0+CiAgPCEtLSBJbXBvcnQgdGhlIGBhbXAtbGlnaHRib3hgIGNvbXBvbmVudCBpbiB0aGUgaGVhZGVyIC0tPgogIDxzY3JpcHQgYXN5bmMgY3VzdG9tLWVsZW1lbnQ9ImFtcC1saWdodGJveCIgc3JjPSJodHRwczovL2Nkbi5hbXBwcm9qZWN0Lm9yZy92MC9hbXAtbGlnaHRib3gtMC4xLmpzIj48L3NjcmlwdD4KICA8IS0tIFlvdSBjYW4gY29tYmluZSB0aGUgbGlnaHRib3ggY29tcG9uZW50IHdpdGggYGFtcC1iaW5kYC4gLS0+CiAgPHNjcmlwdCBhc3luYyBjdXN0b20tZWxlbWVudD0iYW1wLWJpbmQiIHNyYz0iaHR0cHM6Ly9jZG4uYW1wcHJvamVjdC5vcmcvdjAvYW1wLWJpbmQtMC4xLmpzIj48L3NjcmlwdD4KICA8bGluayByZWw9ImNhbm9uaWNhbCIgaHJlZj0iaHR0cHM6Ly9hbXAuZGV2L2RvY3VtZW50YXRpb24vZXhhbXBsZXMvY29tcG9uZW50cy9hbXAtbGlnaHRib3gvaW5kZXguaHRtbCI+CiAgPG1ldGEgbmFtZT0idmlld3BvcnQiIGNvbnRlbnQ9IndpZHRoPWRldmljZS13aWR0aCxtaW5pbXVtLXNjYWxlPTEsaW5pdGlhbC1zY2FsZT0xIj4KICA8c3R5bGUgYW1wLWJvaWxlcnBsYXRlPmJvZHl7LXdlYmtpdC1hbmltYXRpb246LWFtcC1zdGFydCA4cyBzdGVwcygxLGVuZCkgMHMgMSBub3JtYWwgYm90aDstbW96LWFuaW1hdGlvbjotYW1wLXN0YXJ0IDhzIHN0ZXBzKDEsZW5kKSAwcyAxIG5vcm1hbCBib3RoOy1tcy1hbmltYXRpb246LWFtcC1zdGFydCA4cyBzdGVwcygxLGVuZCkgMHMgMSBub3JtYWwgYm90aDthbmltYXRpb246LWFtcC1zdGFydCA4cyBzdGVwcygxLGVuZCkgMHMgMSBub3JtYWwgYm90aH1ALXdlYmtpdC1rZXlmcmFtZXMgLWFtcC1zdGFydHtmcm9te3Zpc2liaWxpdHk6aGlkZGVufXRve3Zpc2liaWxpdHk6dmlzaWJsZX19QC1tb3ota2V5ZnJhbWVzIC1hbXAtc3RhcnR7ZnJvbXt2aXNpYmlsaXR5OmhpZGRlbn10b3t2aXNpYmlsaXR5OnZpc2libGV9fUAtbXMta2V5ZnJhbWVzIC1hbXAtc3RhcnR7ZnJvbXt2aXNpYmlsaXR5OmhpZGRlbn10b3t2aXNpYmlsaXR5OnZpc2libGV9fUAtby1rZXlmcmFtZXMgLWFtcC1zdGFydHtmcm9te3Zpc2liaWxpdHk6aGlkZGVufXRve3Zpc2liaWxpdHk6dmlzaWJsZX19QGtleWZyYW1lcyAtYW1wLXN0YXJ0e2Zyb217dmlzaWJpbGl0eTpoaWRkZW59dG97dmlzaWJpbGl0eTp2aXNpYmxlfX08L3N0eWxlPjxub3NjcmlwdD48c3R5bGUgYW1wLWJvaWxlcnBsYXRlPmJvZHl7LXdlYmtpdC1hbmltYXRpb246bm9uZTstbW96LWFuaW1hdGlvbjpub25lOy1tcy1hbmltYXRpb246bm9uZTthbmltYXRpb246bm9uZX08L3N0eWxlPjwvbm9zY3JpcHQ+CiAgPHN0eWxlIGFtcC1jdXN0b20+CiAgICAubGlnaHRib3ggewogICAgICBiYWNrZ3JvdW5kOiByZ2JhKDAsMCwwLDAuOCk7CiAgICAgIHdpZHRoOiAxMDAlOwogICAgICBoZWlnaHQ6IDEwMCU7CiAgICAgIHBvc2l0aW9uOiBhYnNvbHV0ZTsKICAgICAgZGlzcGxheTogZmxleDsKICAgICAgYWxpZ24taXRlbXM6IGNlbnRlcjsKICAgICAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7CiAgICB9CiAgICAubGlnaHRib3ggaDEgewogICAgICBjb2xvcjogd2hpdGU7CiAgICB9CiAgPC9zdHlsZT4KPC9oZWFkPgo8Ym9keT4KICA8IS0tICMjIEJhc2ljIHVzYWdlIC0tPgogIDwhLS0KICAgIFRoZSBgYW1wLWxpZ2h0Ym94YCBjb21wb25lbnQgZGVmaW5lcyB0aGUgY2hpbGQgZWxlbWVudHMgdGhhdCB3aWxsIGJlIGRpc3BsYXllZCBpbiBhIGZ1bGwtdmlld3BvcnQgb3ZlcmxheS4KICAgIFRvIGNsb3NlIHRoZSBsaWdodGJveCB2aWEgY2xpY2sgb3IgdGFwIHVzZSB0aGUgYG9uYCBhdHRyaWJ1dGUgb24gb25lIG9yIG1vcmUgZWxlbWVudHMgaW5zaWRlIHRoZSBsaWdodGJveC4gSW4gdGhpcyBleGFtcGxlIHRoZSB1c2VyIGNhbiBjbGljayBhbnl3aGVyZSBpbiB0aGUgbGlnaHRib3ggdG8gY2xvc2UgaXQuCgogICAgVGhlIGxpZ2hib3ggaXMgc2hvd24gd2hlbiB0aGUgdXNlciB0YXBzIG9yIGNsaWNrcyBvbiBhbiBlbGVtZW50IHdpdGggYG9uYCBhdHRyaWJ1dGUgdGhhdCB0YXJnZXRzIHRoZSBpZCBvZiBhbiBgYW1wLWxpZ2h0Ym94YCBlbGVtZW50LgogIC0tPgoKICA8IS0tCiAgICBGb3Igc2hvd2luZyBpbWFnZXMgaW4gYSBsaWdodGJveCwgQU1QIGFsc28gZmVhdHVyZXMgdGhlIFthbXAtaW1hZ2UtbGlnaHRib3hdKC9kb2N1bWVudGF0aW9uL2NvbXBvbmVudHMvcmVmZXJlbmNlL2FtcC1pbWFnZS1saWdodGJveC5odG1sKSBjb21wb25lbnQsIHdoaWNoIGRvZXNuJ3QgbmVlZCB0aGUgaW1hZ2UgdG8gc3BlY2lmaWVkIHR3aWNlLgogIC0tPgoKICA8IS0tICMjIENvbWJpbmF0aW9uIHdpdGggYW1wLWJpbmQgLS0+CiAgPCEtLSBgYW1wLWxpZ2h0Ym94YCBjYW4gYmUgb3BlbmVkIGFzIGEgcmVzdWx0IG9mIGBhbXAtYmluZGAgZXZhbHVhdGlvbnMgYnkgYmluZGluZyBhIGJvb2xlYW4gdmFsdWUgdG8gdGhlIGBvcGVuYCBhdHRyaWJ1dGUuIE5vdGUgdGhhdCB3ZSdyZSBhbHNvIGxpc3RlbmluZyB0byB0aGUgYGxpZ2h0Ym94Q2xvc2VgIGV2ZW50IHRvIHJlc2V0IHRoZSBzdGF0ZSBvZiB0aGUgdmFyaWFibGUuIC0tPgogIDxkaXY+CiAgICA8YW1wLWxpZ2h0Ym94IGlkPSJteS1iaW5kYWJsZS1saWdodGJveCIgW29wZW5dPSJzaG93TGlnaHRib3giIGxheW91dD0ibm9kaXNwbGF5IiBvbj0ibGlnaHRib3hDbG9zZTpBTVAuc2V0U3RhdGUoe3Nob3dMaWdodGJveDogZmFsc2V9KSI+CiAgICAgIDxkaXYgY2xhc3M9ImxpZ2h0Ym94IiByb2xlPSJidXR0b24iIHRhYmluZGV4PSIwIiBvbj0idGFwOm15LWJpbmRhYmxlLWxpZ2h0Ym94LmNsb3NlIj4KICAgICAgICA8aDE+SGVsbG8gV29ybGQhPC9oMT4KICAgICAgPC9kaXY+CiAgICA8L2FtcC1saWdodGJveD4KICAgIDxidXR0b24gb249InRhcDpBTVAuc2V0U3RhdGUoe3Nob3dMaWdodGJveDogdHJ1ZX0pIj4KICAgICAgT3BlbiBsaWdodGJveAogICAgPC9idXR0b24+CiAgPC9kaXY+CjwvYm9keT48L2h0bWw+

Click on Open lightbox
Click on Back Button
The State didn't change

What browsers are affected?

All browsers

amp-lightbox When Possible Bug components

Most helpful comment

Hey @caroqliu I'm happy to give this one a try. I think I know what's causing this issue :)

>All comments

Hey @caroqliu I'm happy to give this one a try. I think I know what's causing this issue :)

Was this page helpful?
0 / 5 - 0 ratings

Related issues

aghassemi picture aghassemi  路  3Comments

mkhatib picture mkhatib  路  3Comments

torch2424 picture torch2424  路  3Comments

sryze picture sryze  路  3Comments

gmajoulet picture gmajoulet  路  3Comments