FeatureSnappingLayerSource type error

[ShaneBuscher]

The ES Module FeatureSnappingLayerSource produces an incorrect typing error when setting SnappingOptions on Sketch:

this._layer = new GraphicsLayer();
this._mapView.map.add(this._layer);

this._sketchVM = new SketchViewModel({
  view: this._mapView,
  layer: this._layer,
  snappingOptions: {
    enabled: true,
    featureSources: [{
      layer: this._layer  /** type error **/
    }]
  }
});

Type error:

Spoiler

No overload matches this call.

Overload 1 of 2, '(properties?: SketchViewModelProperties): SketchViewModel', gave the following error.

Type '{ layer: esri.GraphicsLayer; }' is not assignable to type 'FeatureSnappingLayerSourceProperties'.

Object literal may only specify known properties, and 'layer' does not exist in type 'FeatureSnappingLayerSourceProperties'.

Overload 2 of 2, '(properties?: SketchViewModelProperties): SketchViewModel', gave the following error.

Type '{ layer: esri.GraphicsLayer; }' is not assignable to type 'FeatureSnappingLayerSourceProperties'.

Object literal may only specify known properties, and 'layer' does not exist in type 'FeatureSnappingLayerSourceProperties'.ts(2769)

The error occurs because FeatureSnappingLayerSourceProperties type does not have a 'layer' property. The same code above works with AMD which has no type checking. Works when adding TS ignore:

this._sketchVM = new SketchViewModel({
  view: this._mapView,
  layer: this._layer,
  snappingOptions: {
    enabled: true,
    featureSources: [{
      // @ts-ignore: Type definition bug 
      layer: this._layer
    }]
  }
});

Requesting this be fixed in a future release.

[KenBuja · Accepted solution]

It's because snappingOptions is using autocasting. From the docs:

// Create a new instance of Sketch, and set
// a layer for one of the featureSources property.
// This enables feature snapping on that layer.
const sketch = new Sketch({
  layer: graphicsLayer,
  view: view,
  snappingOptions: { // autocasts to SnappingOptions()
    enabled: true,
    featureSources: [{ layer: graphicsLayer }] // autocasts to FeatureSnappingLayerSource()
  }
});

TypeScript doesn't allow for that, so you'll have to create a new SnappingOptions

[ShaneBuscher]

Actually newing up SnappingOptions produces the same TS error because the layer property on FeatureSnappingLayerSource is not defined (as originally posted). 

const options = new SnappingOptions({
      enabled: true,
      featureSources: [new FeatureSnappingLayerSource({ layer: this._layer }]
    });

Error: Object literal may only specify known properties, and 'layer' does not exist in type 'FeatureSnappingLayerSourceProperties'.

[DWVHB]

VS code will bark because it says the layer property is read only.  Create a new generic object (or array of objects) and set it to the featureSources:

const fs:any = {layer: this._layer};

const sketch = new Sketch({
layer: graphicsLayer,
view: view,
snappingOptions: { // autocasts to SnappingOptions()
enabled: true,
featureSources: [fs] 
}
});