Jest: Use of the "this" keyword no longer works

[stroiman]

You used to be able to store data on the "this" object in both setup blocks and tests; just as you can with both mocha and jasmine. This no longer works in jest 20.

For example, the following test should pass, the setup block stores data in the test context, that the test then accesses.

describe('foo', function() {
  beforeEach(function() {
    this.bar = 42;
  })
  it('has a test', function() {
    expect(this.bar).toEqual(42);
  });
})

I replicated this in a very small node project:
https://github.com/PeteProgrammer/jest-bug-test

If you run npm test, the test will fail.
If I run: npm install --save-dev --exact jest@19 then the test passes

I'm running this on node 7.10.0

[marswong]

@PeteProgrammer

to implement asynchronous testing feature better, Jest@20 split a runCLI module implemented in Generator from the cli module, you can find it in jest-cli/build/cli/runCLI.js.

so testing the this in anonymous function is deprecated for now :)

[wejendorp]

Thanks for explaining, I've been meaning to ask the same question. I have a lot of breaking tests because of this.
So is it an intentional breaking change, or something that might get fixed in a later version?

[thymikee]

This came out as one of the breaking changes during our internal refactor of Jasmine and is completely intentional. Use variables reassignment instead of relying on this.
Wonder if we could codemod it? cc: @skovhus

[stroiman]

@thymikee I assume that by "Use variables reassignment" you are referring to named variables inside the test scope, like this:

describe('foo', function() {
  var bar;
  beforeEach(function() {
    bar = 42;
  })
  it('has a test', function() {
    expect(bar).toEqual(42);
  });
})

Or am I misunderstanding you?

The use of this however does allow for some powerful test code patterns, that the variable pattern cannot support, e.g. something like this:

// We can have this as a helper function somewhere.
function useSinon() {
    beforeEach(function() {
        this.sinon = sinon.sandbox.create();
    })
    afterEach(function() {
        this.sinon.restore();
    })
}

describe('feature', function() {
    // By calling useSinon in this level, each test case does not have to duplicate mocking.
    useSinon();

    it('has mock support', function() {
        this.sinon.stub(...);
        ....
    })
})

[thymikee]

Still doable:

// We can have this as a helper function somewhere.
function useSinon(mySinon) {
    beforeEach(function() {
        mySinon = sinon.sandbox.create();
    })
    afterEach(function() {
        mySinon.restore();
    })
}

describe('feature', function() {
    let mySinon;
    // By calling useSinon in this level, each test case does not have to duplicate mocking.
    useSinon(mySinon);

    it('has mock support', function() {
        mySinon.stub(...);
        ....
    })
})

[skovhus]

@thymikee I've created an issue for this/this. ; )

[thymikee]

Thank you!

[just-boris]

@thymikee your solution will not work because variables are passed by reference. The value inside useSinon will change, but will not be changed outside.

As for me, I see a possible solution with arrow functions:

function useSinon(context) {
    beforeEach(function() {
        context.sinon = sinon.sandbox.create();
    });
    afterEach(function() {
        context.sinon.restore();
    });
}

describe('feature', function () {
  useSinon(this);

  it('has mock support', () => {
      // inside arrow functions, this will be the same as well is in surrounding code.
      this.sinon.stub(...);
  });
});

[AlanFoster]

This is a breaking change for us - but it's not present in the change logs.
Is it possible to mention that? 🤔

[AlanFoster]

For visibility; It is possible to resolve this issue with a code shift:

https://github.com/skovhus/jest-codemods/pull/61

[artsyca]

there's another way, we can apply a function like:

function initContext () {
    this.app = express ();
    this.http = http.Server (this.app);
    ...
}

and then in each test:

it('has a context', function() {
    initContext.apply(this);
}

[vinczedani]

is this issue fixed? I wanted to use this, but it seems like it still doesn't work (jest v23)
Any update on this?