topic v4.10 - extend BaseLayerView2D in typescript in ArcGIS JavaScript Maps SDK Questions

v4.10 - extend BaseLayerView2D in typescript

NickCameron2 — Sat, 11 Dec 2021 14:53:14 GMT

Hi,

In 4.9 extending a BaseLayerView2D was simple as in the following:

import BaseLayerView2D = require("esri/views/2d/layers/BaseLayerView2D");

class ExtendedLayerView extends BaseLayerView2D {

   // implementation...

}‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

In 4.10 the typings have changed so that BaseLayerView2D is an interface instead of a class, therefore extends won't work.

Have only worked out a very hacky way to call createSubclass to make it work...but lose all static typing with the class then as well.

Any ideas how to correctly extend BaseLayerView2D using v4.10 typings?

Thanks!

Re: v4.10 - extend BaseLayerView2D in typescript

ReneRubalcava — Sat, 11 Dec 2021 14:53:17 GMT

This is a doc issue we can fix for 4.11. In the meantime you can work around this by copying the BaseLayerView2D typings from 4.9 into your project.

Suggested method as follows.

1. Create a typings folder with an extensions.d.ts file.

declare module "esri/views/2d/layers/BaseLayerView2D" {
  class BaseLayerView2D {
    layer: Layer;
    tiles: Tile[];
    view: MapView;
    attach(): void;
    detach(): void;
    render(renderParameters: BaseLayerView2DRenderRenderParameters): void;
    protected requestRender(): void;
    tilesChanged(added: Tile[], removed: Tile[]): void;
  }
  export = BaseLayerView2D;
}‍‍‍‍‍‍‍‍‍‍‍‍‍

This is taken directly from the 4.9 typings.

2. Update your tsconfig.json to use the new typings file.

{
  "compilerOptions": {
    ...
  },
  "include": [
    "src/*",
    "typings/*" // this will read all .ts files in your typings folder
  ]
}
‍‍‍‍‍‍‍‍‍

This should now let you use the correct typings.

Thanks!

Re: v4.10 - extend BaseLayerView2D in typescript

NickCameron2 — Sat, 11 Dec 2021 14:53:20 GMT

Hi Rene,

Thanks for the response!

Originally I tried the following in a custom *.d.ts file, just to create a fake export that was an object with a constructor and the right properties.

declare namespace __esriExtend {
    interface BaseLayerView2DConstructor {
        new(properties?: any): __esri.BaseLayerView2D;
    }

    export const BaseLayerView2DBase: BaseLayerView2DConstructor;
}

declare module "esri/views/2d/layers/BaseLayerView2D" {
    import BaseLayerView2DBase = __esriExtend.BaseLayerView2DBase;
    export = BaseLayerView2DBase;
}‍‍‍‍‍‍‍‍‍‍‍‍

That produces the error - Duplicate identifier 'BaseLayerView2D'.

The same error occurs with your suggestion.

There can't be two:

declare module "esri/views/2d/layers/BaseLayerView2D"

in the one project.

I can get around it by commenting out the 4.10 typings module declaration, but obviously that's not ideal. Can you think of anything else sorry? If it just means waiting for 4.11, in my case that's not so bad. Is there an expected release date?

Thanks,

Nick