Getting error on viewing Scene Service using ArcGIS Javascript API - Cannot use 'in' operator to search for 'code' in false

I am using ArcGIS Javascript API 4.11. I'm getting these errors while viewing Scene Service from my portal and providing its Id.

Here is the screenshot of the error that I receive. Screenshot 01

This is the code that I use.

require([
  "esri/Map",
  "esri/views/SceneView",
  "esri/layers/SceneLayer",
  "esri/identity/OAuthInfo",
  "esri/identity/IdentityManager",
  "esri/layers/ImageryLayer",
  "esri/views/layers/ImageryLayerView"
], function(
  Map, SceneView, SceneLayer, OAuthInfo, esriId, ImageryLayer, ImageryLayerView
) {
  debugger;
  var info = new OAuthInfo({
    appId: "AnFbtGbH4t9A2XTi",
    // appId: "q244Lb8gDRgWQ8hM",
    // Uncomment the next line and update if using your own portal
    // portalUrl: "https://<host>:<port>/arcgis"
    // Uncomment the next line to prevent the user's signed in state from being shared with other apps on the same domain with the same authNamespace value.
    // authNamespace: "portal_oauth_inline",
    popup: false
  });

  esriId.registerOAuthInfos([info]);

  esriId
  .checkSignInStatus(info.portalUrl + "/sharing")
  .then(function() {
    //displayItems();
  }).catch(function() {
    // Anonymous view
    esriId.getCredential(info.portalUrl + "/sharing");
  });

  var map = new Map({
    basemap: "dark-gray",
    ground: "world-elevation"
  });

  var view = new SceneView({
    container: "viewDiv",
    map: map,
  });

  var sceneLayer = new SceneLayer({
    portalItem: {
      id: "e7bf9f676ed64937bff9f44c84fdae2b"
    },
    popupEnabled: false
  });

  map.add(sceneLayer);
});

The map is getting loaded but the scene layer is not getting loaded. Please help.

Similar code I tried in codepen with the same Id also gives me the same error - https://codepen.io/anon/pen/rEqgJB

Solution

The portal item you are trying to load is in fact a BuildingSceneLayer. The above code tries to load it as a regular SceneLayer.

That's why the API reports an error SceneLayer does not support this layer type (2nd error in your screenshot).

Simply replace SceneLayer with BuildingSceneLayer and everything works:

require([
  "esri/Map",
  "esri/views/SceneView",
  "esri/layers/BuildingSceneLayer"
], function(Map, SceneView, BuildingSceneLayer) {

...

  // Create BuildingSceneLayer and add to the map
  var sceneLayer = new BuildingSceneLayer({
    portalItem: {
      id: "e7bf9f676ed64937bff9f44c84fdae2b"
    },
    popupEnabled: false
  });
  map.add(sceneLayer);

...

});

Here is a fixed Codepen that shows the building after loading the layer. https://codepen.io/arnofiva/pen/c410babb5384945a12b1d8206ebe27ce?editors=1010

An alternative way to achieve the same is asking the API to load an arbitrary layer from a portal item, in which case it automatically detects the layer type:

Layer.fromPortalItem({
  portalItem: {
    id: "e7bf9f676ed64937bff9f44c84fdae2b"
  }
}).then(function(layer) {
  // Adds layer to the map
  map.add(layer);
});

You might want to checkout these samples showing BuildingSceneLayer-specific capabilities: