[JS] JsInterop.jsOptions produces unexpected output for nested types

[Linschlager]

Description

JsInterop.jsOptions compiles to a js record containing the specified fields. This works nicely for simple interfaces, however it behaves unexpectedly with nested ones.

REPL

Repro code

open Fable.Core

[<AllowNullLiteral>]
type MyInnerType =
  abstract member value: int with get, set

[<AllowNullLiteral>]
type MyOuterType =
  abstract member nested: MyInnerType with get, set

let x = JsInterop.jsOptions<MyOuterType> (fun o ->
  o.nested.value <- 10
)

Actual output

export const x = {
    value: 10,
};

Expected output

export const x = {
    nested = {
        value: 10,
    }
};

or compilation error

Related information

• REPL: 4.2.0
• Fable: 4.23.0

[MangelMaxime]

I think you are supposed to call jsOptions again for the inner type:

open Fable.Core
open Fable.Core.JsInterop

[<AllowNullLiteral>]
type MyInnerType =
  abstract member value: int with get, set

[<AllowNullLiteral>]
type MyOuterType =
  abstract member nested: MyInnerType with get, set

let x = jsOptions<MyOuterType> (fun o ->
  o.nested <- jsOptions<MyInnerType>(fun o ->
    o.value <- 10
  )
)

export const x = {
    nested: {
        value: 10,
    },
};

Perhaps, it is possible to make jsOptions works the way you shown but this will need to be investigated as I am not familiar with that part of the code yet.

[Linschlager]

@MangelMaxime Yes, that was my conclusion as well and that works nicely, however it is a bit more verbose.
It mostly seemed like unexpected behaviour which is why I reported it here.