Enhance snippets to work with basemaps (using API keys) & JS SDK 4.x

[hhkaos]

trafficstars

Check existing issues

• [X] I have checked for existing issues to avoid duplicates

Snippet prefix

"require" and "map"

Proposal

1) map enhance proposal

The map prefix adds:

const map = new Map({
        basemap: "arcgis-imagery"
      });
      const view = new MapView({
        container:"viewDiv",
        map:map,
        zoom:  4,
        center: [15,65]
      });

Following our conventions and having to remove variable declaration, I would replace it using autocasting and changing the prefix to MapView to have something like this (I have replace the basemap selector with to prefixes of the two snippets to the the different basemap enums):

https://github.com/Esri/arcgis-js-vscode-snippets/assets/826965/0a2ece06-1b05-40e6-b237-8f23ec7bb050

My proposed snippets:

"Create MapView using a Map": {
  "prefix": "MapView",
  "body": [
    "new MapView({",
    "\tcenter: ${1:[15, 65]},",
    "\tcontainer: \"${2:viewDiv}\",",
    "\tmap: {",
    "\t\tbasemap: ${3:basemapsWithAPIKeys|basemapsWithoutAPIKeys}",
    "\t},",
    "\tzoom: ${4:4}"
    "});",
  ],
  "description": "Create MapView using a Map"
},
"Basemaps with API keys": {
  "prefix": "basemapsWithAPIKeys",
  "body": [
    "\"${1|arcgis-imagery,arcgis-imagery-standard,arcgis-imagery-labels,arcgis-light-gray,arcgis-dark-gray,arcgis-navigation,arcgis-navigation-night,arcgis-streets,arcgis-streets-night,arcgis-streets-relief,arcgis-topographic,arcgis-oceans,osm-standard,osm-standard-relief,osm-streets,osm-streets-relief,osm-light-gray,osm-dark-gray,arcgis-terrain,arcgis-community,arcgis-charted-territory,arcgis-colored-pencil,arcgis-nova,arcgis-modern-antique,arcgis-midcentury,arcgis-newspaper,arcgis-hillshade-light,arcgis-hillshade-dark|}\"",
  ],
  "description": "Basemaps enums to be used with API keys"
},
"Basemaps without API keys": {
  "prefix": "basemapsWithoutAPIKeys",
  "body": [
    "${1|satellite,hybrid,oceans,osm,terrain,dark-gray-vector,gray-vector,streets-vector,streets-night-vector,streets-navigation-vector,topo-vector,streets-relief-vector|}",
  ],
  "description": "Basemaps enums to be used without API keys"
}

The same thing would apply to scene

---

UPDATE: dismiss this one

2) require enhance proposal

require snippets adds:

require(["esri/Map", "esri/views/MapView","dojo/domReady!"],function(Map, MapView){
      
  });

dojo/domReady! which if I'm not wrong is for the JS SDK 3.x, right? In 4.x it returns a:

Failed to load resource: the server responded with a status of 404 ()
4.27:31 Error: scriptError: https://js.arcgis.com/4.27/dojo/domReady.js
    at n (4.27:6:46)
    at HTMLScriptElement.<anonymous> (4.27:30:44)

So, considering 3.x will be retired in July 2024, we should remove the dojo/domReady.

I would also include to add a require and a requireApiKeys

require([
	"esri/config",
	"esri/Map", 
	"esri/views/MapView"
], function(
	esriConfig,
	Map, 
	MapView
){
      esriConfig = "${1:YOUR_API_KEY}";
});

---

What do you think @kellyhutchins ?

[hhkaos]

I have already introduced changes to the require snippets and added requireApiKeys (available snippets)