Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Implement constructor mocking #5004

Closed
haraldrudell opened this issue Dec 2, 2017 · 9 comments
Closed

Implement constructor mocking #5004

haraldrudell opened this issue Dec 2, 2017 · 9 comments

Comments

@haraldrudell
Copy link

haraldrudell commented Dec 2, 2017

Request to implement constructor mocking

In #663, there was a clever statement by @cpojer:

…JS doesn't really allow to call the constructor with variadic arguments and a bound context.

However, since ECMAScript 2015, the new operator allows a rest element likeso:

  class C {
    constructor(a) {
      console.log('a', a) // "a 1"
    }
  }

  const args = [1, 2, 3]
  new C(...args)

and if an intermediate constructor returns a value, that is taken to be the object that was constructed.

Constructors do not work with regular mocks, because they require the new operator.

Could we now have some special mock function for constructors?

I wanted to use those in Jest tests, to intercept and extend a ReactJS component being tested
facebook/create-react-app#3482

ie. I want to have the regular code use an AppExtended class that I code up inside the test, a class that extends App when it is run as a test. Maybe it is not possible.

@haraldrudell
Copy link
Author

Here’s what I want to Jestify:

Whenever they instantiate App, give’m AppTest, and in particular for the case when App is a default export

import React from 'react'
import ReactDOM from 'react-dom'
import App, * as AppImport from './App'

it('renders without crashing', async () => {
  class AppTest extends App {
    static promise
    componentDidMount(...args) {
      return AppTest.promise = super.componentDidMount(...args)
    }
  }

  const App0 = App
  AppImport.default = AppTest

  const div = document.createElement('div');
  await new Promise((resolve, reject) => ReactDOM.render(<App />, div, resolve))

  // wait for the promise to conclude
  const promise = AppTest.promise
  expect(promise).toBeInstanceOf(Promise, 'Instrumenting App instance failed')
  await promise

  AppImport.default = App0
})

@cpojer
Copy link
Member

cpojer commented Dec 4, 2017

Thanks for bringing this up. We are dropping node 4 with the next major and I am fine with this change if it makes mocks more solid. Can you work on a pull request? :)

@haraldrudell
Copy link
Author

haraldrudell commented Dec 4, 2017

In two weeks or so.

I think you would need to add to the documentation, possibly in the guides section:

  • Mocking, Intercepting or extending an ECMAScript class (partially this feature)
  • Mocking or Intercepting an ECMAScript class instance method
  • Mocking or intercepting a named or default ECMAScript module export

I think you also are missing a section on how use breakpoints in tests with or without Create React App

  • Insert debugger statement
  • Issue this command
  • Browse to chrome://…
    just to let people get started

I would also appreciate a link to the fattest (Facebook) open-source project using Jest the recommended way together with ECMAScript 2017 and ReactJS

I am trying to learn everything that matters about Jest. Then, people will force me to use Karma/Chromium, too.

Having users is a bitch ;)

@orta
Copy link
Member

orta commented Dec 4, 2017

I think you would need to add to the documentation, possibly in the guides section:

Mocking, Intercepting or extending an ECMAScript class (partially this feature)
Mocking or Intercepting an ECMAScript class instance method
Mocking or intercepting a named or default ECMAScript module export

I wonder if a jest mockbook (like a cookbook) repo where there is an individual example for each one of these cases, and more would be useful. ( Wallaby.js does a good example for this though it is per-repo).

Would be a nice reference tool for anyone getting started.

@orta
Copy link
Member

orta commented Dec 4, 2017

would also appreciate a link to the fattest (Facebook) open-source project

Probably https://github.com/facebook/react-native

@ValentinFunk
Copy link

I wonder if a jest mockbook (like a cookbook) repo where there is an individual example for each one of these cases, and more would be useful.

A thousand times this! I've been trying jest a few times and it's always endless browsing of docs, searching github for examples and in the end trying everything from github issues and stackoverflow answers. Big pain!

@github-actions
Copy link

This issue is stale because it has been open for 1 year with no activity. Remove stale label or comment or this will be closed in 30 days.

@github-actions github-actions bot added the Stale label Feb 26, 2022
@github-actions
Copy link

This issue was closed because it has been stalled for 7 days with no activity. Please open a new issue if the issue is still relevant, linking to this one.

@github-actions
Copy link

This issue has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.
Please note this issue tracker is not a help forum. We recommend using StackOverflow or our discord channel for questions.

@github-actions github-actions bot locked as resolved and limited conversation to collaborators Apr 28, 2022
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

No branches or pull requests

5 participants