Save WebMap Error: Error TypeError: Cannot read property 'addItem' of null.

[RobertBossio]

Trying to save WebMap to esri fails. For testing, I'm just loading a plain base map and saving it. I get the error: Error TypeError: Cannot read property 'addItem' of null.

Code: (Using Javascript API v4.20)

// item automatically casts to a PortalItem instance by saveAs
var item = {
title: title.value
};

// Update properties of the WebMap related to the view.
// This should be called just before saving a webmap.
map.updateFrom(view).then(function () {
map.saveAs(item)
// Saved successfully
.then(function (item) {
// link to the newly-created web scene item
var itemPageUrl =
item.portal.url + "/home/item.html?id=" + item.id;
var link = '<a target="_blank" href="' + itemPageUrl +
'">' + title.value + "</a>";

statusMessage("Save WebMap",
"<br> Successfully saved as <i>" + link + "</i>"
);
})
// Save didn't work correctly
.catch(function (error) {
statusMessage("Save WebMap", "<br> Error " + error);
});
});

[BjornSvensson]

The code above seems like it was originally from https://developers.arcgis.com/javascript/latest/sample-code/sandbox/?sample=webmap-save . Does it work if you use the original code?

[RobertBossio]

Bjorn - thanks for responding. Yes, that's exactly where I found the example. If I copy code exactly (entire HTML) and paste into a new page, it works fine. However, if I just use the code snippet to save map in my current application, I get the error reported. I did notice that if I remove the reference to config (i.e. require(["esri/config"], (esriConfig) => {}), then it seems to save to my portal (after I sign in), however it does not save the layers. Also, since I can't use the config reference, I have to log-in up-front (before I can use my app) which I want to avoid. I created a public map  to use as (portalItem: {id: "<id>"}), but although I made that map public, it still asks me to log-in.

To recap, I'd prefer to use the config (and apiKey) to start the application, but then have the user log-in only when they want to save their map (they may never want to but a feature we wanted to add). It also needs to save layers. I create a graphic layer, and feature layers and I discovered you can't save graphic layer so I remove it before I save it. I then get no errors, but feature layers don't save with the map.

I don't know if I can provide more details but hopefully there's an example somewhere using the config option.

Thanks.

[BjornSvensson]

@RobertBossio , not sure I fully understand, but ... API keys are for accessing services/content. They don't give you enough power/permission to save anything.

See https://developers.arcgis.com/documentation/mapping-apis-and-services/security/api-keys/ 

[RobertBossio]

I've abandoned the API key since I need each user to log-in to their own accounts. I'm now using portal API to login. I'm now able to save maps, but the layers created in my web app are not saving with the map. I'm basically trying to either:

1. Save the map and all layers (FeatureLayers, and if possible GraphicLayers) created/visible on my web application to the user's portal. Or;

2. Save individual layers (FeatureLayers, and if possible GraphicLayers) back to the user's portal to apply in their own maps.

Tried many different approaches without success. Looking for any examples.

My latest code:

var portal = new Portal({
   authMode: "immediate"
});

if (id === "save-layer") {
   portal.user.addItem({
      item: event.item.layer, //LayerList item clicked, saving associated layer
      data: "layer"
   }).then((portalItem) => {
      console.log(portalItem)
   }, (error => {
      console.log(error);
   }));

Error: Uncaught TypeError: C.createPostQuery is not a function