wyze/bs-react-testing-library

BuckleScript bindings for react-testing-library.

bs-react-testing-library ·

BuckleScript bindings for react-testing-library.

Documentation

Read the docs | Edit the docs

Installation

$ yarn add --dev bs-react-testing-library

# or..

$ npm install --save-dev bs-react-testing-library

Usage

Add to bsconfig.json

{
  "bs-dev-dependencies": [
    "bs-react-testing-library"
  ]
}

With bs-jest

/* Component_test.re */

open Jest;
open Expect;
open ReactTestingLibrary;

test("Component renders", () =>
  <div style=ReactDOMRe.Style.make(~color="rebeccapurple", ())>
    <h1> {ReasonReact.string("Heading")} </h1>
  </div>
  |> render
  |> container
  |> expect
  |> toMatchSnapshot
);

Examples

See src/__tests__ for some examples.

Development

$ git clone https://github.com/wyze/bs-react-testing-library.git
$ cd bs-react-testing-library
$ yarn # or `npm install`

Build

$ yarn build

Test

$ yarn test

Change Log

Full Change Log

v0.8.0 (2020-10-21)

• Upgrade to latest dependencies (@wyze in #27)
• Add sponsor button (@wyze in c69f028)

License

MIT © Neil Kistner

bs-react-testing-library's Issues

Error: package bisect_ppx not found or built

Not a big deal, just confusing as it's nowhere mentioned, I've even checked other repos using bs-react-testing-library, many don't have bisect_ppx as a dependency, yet I wasn't able to build after adding bs-react-testing-library to my project without adding bisect_ppx as well 🤷‍♂️

{
  "name": "top-secret",
  "reason": { "react-jsx": 3 },
  "bsc-flags": ["-bs-super-errors"],
  "sources": [
    {
      "dir": "src",
      "subdirs": true
    }
  ],
  "package-specs": [
    {
      "module": "es6",
      "in-source": true
    }
  ],
  "suffix": ".bs.js",
  "namespace": true,
  "bs-dependencies": ["reason-react"],
  "bs-dev-dependencies": ["@glennsl/bs-jest", "bs-react-testing-library"],
  "warnings": {
    "number": "+R",
    "error": "+R"
  },
  "ppx-flags": ["bisect_ppx/ppx"],
  "refmt": 3
}

I just started with Reason and all its chain this morning so .. 😅

Couldn't not mention it somewhere, as info or question.

Migrating to the new syntax and @rescript/react

Hey, first of all thanks for your working on this bindings 🙏🏻

I'm opening this issue to discuss the migration from reason-react to @rescript/react and the syntax migration from .re to .res. Are you planning something like that?

examples of using debug?

Hello, curious if you have any examples of how to use the debug() function w/ this library?

either by itself (debug the whole dom tree) or w/ an element passed in.

many thanks

Invitation to move to testing-library org

It's up to you, but if you'd like, you're welcome to transfer this repository to the testing-library organization on GitHub. This will give your project more credibility as part of the testing-library family of projects with a unified mission of tools which help people avoid testing implementation details.

Again, totally up to you. I just want you to know we appreciate all you've done and you're welcome to join us if you like.

Simulate.click is not defined

Currently click event is possible via Simulate.click. Internally it binds to

[@bs.module "react-testing-library"] [@bs.scope "Simulate"]
external click : Dom.element => unit = "";

which throws error.

Correct way should be to do:

[@bs.module "react-testing-library"] [@bs.scope "fireEvent"]
external click: Dom.element => unit = "";

based on the example in the react-testing-library README

How to use findBy* functions?

I couldn't figure it out. Any advice?

Move to JS X 3

Are there any plans to transition to JS X version 3? I am working on a branch now, and wanted to know if I should put up a PR, to get some feedback back on it.

How do we add an options object to *ByRole queries?

I've seen people do |> getByRole(~matcher=`Str("heading"), ~options=?None) but I can't find anyone actually submitting options. I have tried:

  |> getByRole(~matcher=`Str("heading"), ~options=?Some({"level": 3}))
  |> getByRole(~matcher=`Str("heading"), ~options=Some({"level": 3}))
  |> getByRole(~matcher=`Str("heading"), ~options=?Some(`Obj({"level": 3})))

etc but I can't get it to compile. How do we enter the options?

Thank you

FireEvent

I have a branch where I was working on a transition to JSX 3, and I am having some trouble figuring out how to invoke FireEvent. After reading the source, it seems that it should correctly link to bs-dom-testing-library, will look into it more.

Feel free to checkout the FireEvent example I have up.
https://github.com/justinba1010/bs-react-testing-library/tree/jsx3-fire-event