Help fixing this JS binding code

Learning
1

Error:

50 |     joo_global##.__CM_view = codemirror##.EditorView
                                  ^^^^^^^^^^
Error: This expression has type codemirror_vim
       but an expression was expected of type < .. > Js.t

Code:

(*
import { EditorView, basicSetup } from "codemirror"
import { EditorState } from "@codemirror/state"
import { hoverTooltip } from "@codemirror/view"
import * as lint from "@codemirror/lint"
import * as autocomplete from "@codemirror/autocomplete"
import * as dark from "@codemirror/theme-one-dark"
import * as language from "@codemirror/language"
import { oCaml } from "@codemirror/legacy-modes/mode/mllike"
import { vim } from "@replit/codemirror-vim"

joo_global_object.__CM__view = EditorView;
joo_global_object.__CM__state = EditorState;
joo_global_object.__CM__lint = lint;
joo_global_object.__CM__autocomplete = autocomplete;
joo_global_object.__CM__hoverTooltip = hoverTooltip;
joo_global_object.__CM__basic_setup = basicSetup
joo_global_object.__CM__dark = dark;
joo_global_object.__CM__stream_parser = language;
joo_global_object.__CM__mllike = oCaml;
joo_global_object.__CM__vim = vim;
   *)

open Js_of_ocaml

type codemirror = Ojs.t
type codemirror_state = Ojs.t
type codemirror_view = Ojs.t
type codemirror_lint = Ojs.t
type codemirror_autocomplete = Ojs.t
type codemirror_dark = Ojs.t
type codemirror_language = Ojs.t
type codemirror_ocaml = Ojs.t
type codemirror_vim = Ojs.t

let codemirror : codemirror = Js_of_ocaml.Js.Unsafe.js_expr {| require("codemirror") |}
let codemirror_state : codemirror_state = Js_of_ocaml.Js.Unsafe.js_expr {| require("@codemirror/state") |}
let codemirror_view : codemirror_view = Js_of_ocaml.Js.Unsafe.js_expr {| require("@codemirror/view") |}
let codemirror_lint : codemirror_lint = Js_of_ocaml.Js.Unsafe.js_expr {| require("@codemirror/lint") |}
let codemirror_autocomplete : codemirror_autocomplete = Js_of_ocaml.Js.Unsafe.js_expr {| require("@codemirror/autocomplete") |}
let codemirror_dark : codemirror_dark = Js_of_ocaml.Js.Unsafe.js_expr {| require("@codemirror/theme-one-dark") |}
let codemirror_language : codemirror_language = Js_of_ocaml.Js.Unsafe.js_expr {| require("@codemirror/language") |}
let codemirror_ocaml : codemirror_ocaml = Js_of_ocaml.Js.Unsafe.js_expr {| require("@codemirror/legacy-modes/mode/mllike") |}
let codemirror_vim : codemirror_vim = Js_of_ocaml.Js.Unsafe.js_expr {| require("@replit/codemirror-vim") |}

let joo_global = Js.Unsafe.global##.joo_global_objrect

let _ = 
  begin
    joo_global##.__CM_view = codemirror##.EditorView
  end

What I am confused on why it thinks codemirror has type codemirror_vim

2

In order to use the js-of-ocaml syntax, your type should belong to 'a Js.t type.

You should type your element as:

let codemirror : codemirror Js.t = …
3

All of your types are aliases to Ojs.t, with codemirror_vim being the last before the line with the error. Transitively, if codemirror = Ojs.t and Ojs.t = codemirror_vim, then codemirror = codemirror_vim.

4

You might also look for inspiration into these bindings: GitHub - patricoferris/jsoo-code-mirror: Jsoo bindings using brr for code-mirror 6

They are incomplete and still unreleased, but if they cover your use cases you could also reuse and complete them :slight_smile:

They are in used in the ocaml.org playground that supports auto-completion and on-hover type hints.

5

On sorry, I forgot to mention – I got this problem solved.

6

It’s a great idea to share the solution for further readers :+1:

1 Like
7

There honestly is not much to share. @zbaylin and @Chimrod explained the compile error; after “fixing” that, I ran into runtime errors (my fault, initialization order), which I resolved by using a different design.