Home and Bookmark Widget buttons do not work in Chrome and Edge

[Shingo-Ikeda]

I am working on Angular app and noticed that some button widgets are not working. Specifically, Home, Compass and Bookmark buttons that are added using the following code do not work:

    const map = new Map({
      basemap: 'oceans', // See https://developers.arcgis.com/javascript/3/jsapi/esri.basemaps-amd.html
    });

    const view = new MapView({
      container: this.mapViewEl.nativeElement,
      center: [-95.71, 37.09],
      zoom: 3,
      map: map,
      constraints: {
        rotationEnabled: true,
      },
      popup: {
        dockEnabled: true,
        dockOptions: {
          buttonEnabled: true,
          breakpoint: false,
        },
        visibleElements: {
          closeButton: true,
          heading: true,
          actionBar: true,
          collapseButton: true
        }
      },
    });

    let compass = new Compass({
      view: view
    });
    view.ui.add(compass, "top-left");

    const homeWidget = new Home({
      view: view
    });
    view.ui.add(homeWidget, 'top-left');

    // Add a basemap Gallery
    const bg = new BasemapGallery({
      view: view,
      container: document.createElement('div'),
    });
    const expand = new Expand({
      view: view,
      content: bg,
    });
    view.ui.add(expand, 'top-right');

    const bookmarks = new Bookmarks({
      view: view,
      dragEnabled: true,
      visibleElements: {
        addBookmarkButton: true,
        editBookmarkButton: true,
        time: false // don't show the time (h:m:s) next to the date
      }
    });

    const bkExpand = new Expand({
      view: view,
      content: bookmarks,
      expanded: false
    })
    view.ui.add(bkExpand, "top-right");

While basemap gallery works, other buttons are not working. I cleared web cache and tested in in-cognito mode as well. I appreciate any input. Thanks!

[AndyGup · Accepted solution]

This is due to a bug in Angular that was fixed in zone.js 0.14.5. See the known issues listed in our Angular example, here: https://github.com/Esri/jsapi-resources/tree/main/core-samples/jsapi-angular-cli#known-issues

[Shingo-Ikeda]

Thanks Andy! It was the exact solution I was looking for. 🙂