[JS] casting a .NET Dictionary to ICollection JS should not use .push

[goswinr]

Casting a .NET Dictionary to an ICollection emits .push for .Add, but a JS Map has no .push member.

open System.Collections.Generic

let dic = Dictionary<int,string>()  

let coll = dic :> ICollection<KeyValuePair<_,_>>    

let kv = KeyValuePair(1,"a")

coll.Add(kv) // emits .push on a JS Map, but Map has no .push member

REPL

fable 4.21

[MangelMaxime]

It seems like this is not has easy to fix as I though.

JS Map doesn't seem to have a Add equivalent, it only have a set prototype for adding / updating an element.

I think the issue comes from the fact that Dictionary<int, string>() is represented using JS.Map instead of a class / wrap we control.

Because of that, when calling:

open System.Collections.Generic

let dic = Dictionary<int,string>()  

dic.Add(2, "b")

Then Fable is able to replace the Add call with addToDict

import { addToDict } from "fable-library-js/MapUtil.js";

export const dic = new Map([]);

addToDict(dic, 2, "b");

But when doing the cast to ICollection Fable can't do the replacement, because the concrete type of ICollection can be anything. I think the path to fix this issue is to rework how Dictionary<'Key, 'Value> works and instead of using JS.Map directly, we should extends it:

 class ExtendedMap extends Map {
    constructor() {
        super();
    }
    
   add(key, value) { // This will replace the call to `addToDict`
	// ...
   }
 }

In theory, it means that the new Map class will keep fulfilling the following statement from Fable

If people compare the constructor there will be issues, but the existing API should keep working.