Module Type Structure

Every interface in a Web API module can potentially contain methods. These methods are modeled in a separate module named after the interface.

The primary reason for this separation is to handle method overloads. As explained in the Design Philosophy section, ReScript does not permit records to define the same properties more than once. Therefore, methods with overloads cannot be modeled within the same record type.

Bindings

Another advantage of having a separate file is that these bindings can utilize all types defined in the API module. Under normal circumstances, the type module only contains @send bindings where the type is the first parameter.

DirectoryDOMAPI
- HTMLButtonElement.res

/**
Returns whether a form will validate when it is submitted, without having to submit it.
[Read more on MDN](
  https://developer.mozilla.org/docs/Web/API/HTMLButtonElement/checkValidity)
*/
@send
external checkValidity: htmlButtonElement => bool = "checkValidity"

Inheritance

When an interface inherits from another interface, the base interface methods can be included into the inheriting interface.
All methods from HTMLElement should also be available on HTMLButtonElement.

open DOMAPI

// A concrete type for `T.t` is passed later using the `include` keyword.
module Impl = (T: { type t }) => {

/**
[Read more on MDN](https://developer.mozilla.org/docs/Web/API/HTMLElement/focus)
*/
@send
external focus: (T.t, ~options: focusOptions=?) => unit = "focus"

}

include Impl({ type t = htmlElement })

open DOMAPI

// Include all the methods from HTMLElement
include HTMLElement.Impl({ type t = htmlButtonElement })

// Add additional methods specific to HTMLButtonElement:

/**
Returns whether a form will validate when it is submitted, without having to submit it.
[Read more on MDN](
  https://developer.mozilla.org/docs/Web/API/HTMLButtonElement/checkValidity)
*/
@send
external checkValidity: htmlButtonElement => bool = "checkValidity"