# How to mock ValidationController and inject into component

**URL:** <https://discourse.aurelia.io/t/how-to-mock-validationcontroller-and-inject-into-component/1709>\
**Category:** Help Requests\
**Created:** [October 8, 2018, 8:50pm UTC](https://discourse.aurelia.io/t/how-to-mock-validationcontroller-and-inject-into-component/1709 "2018-10-08T20:50:37Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![stevies](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/stevies/32/1039_2.png) [@stevies](https://discourse.aurelia.io/u/stevies)\
**Post date:** [October 8, 2018, 8:50pm UTC](https://discourse.aurelia.io/t/how-to-mock-validationcontroller-and-inject-into-component/1709/1 "2018-10-08T20:50:37Z")

</div>

How do you easily mock a ValidationController?

Got a custom element - looks like this:

```auto
@inject(NewInstance.of(ValidationController))
export class MyCustomThing {
  constructor(controller) {
     this.controller = controller;  
     ...
  }

  async save() {
    const result = await this.controller.validate();
    ...
  }
}

```

Want to write a test - eg:

```auto
it('save', async () => {
    await myComp.viewModel.save();
    expect(controller.validate).toHaveBeenCalled();
});

```

Struggling to do all the boilerplate stuff needed by aurelia-testing. Tried this (more or less from the documentation example at [https://aurelia.io/docs/testing/components#testing-custom-component-with-a-real-view-model](https://aurelia.io/docs/testing/components#testing-custom-component-with-a-real-view-model)) - no luck:

```auto
import {StageComponent} from 'aurelia-testing';
import {bootstrap} from 'aurelia-bootstrapper';
import {ValidationController} from 'aurelia-validation';

describe('MyCustomThing ', () => {
  let component;
  let controller = {
    validate: jest.fn()
  };

  beforeEach(() => {
    component = StageComponent.withResources('my-custom-thing')
      .inView('<my-custom-thing></my-custom-thing>');

    component.bootstrap(aurelia => {
      aurelia.use.standardConfiguration().plugin('aurelia-validation');
      aurelia.container.registerInstance(ValidationController, controller);
    });
  });

  afterEach(() => {
    component.dispose();
  });

  it('save', async () => {
    await component.create(bootstrap);
    await component.viewModel.save();
    expect(controller.validate).toHaveBeenCalled();
  });
});

```

No luck.

```auto
Expected mock function to have been called, but it was not called.

```

The mock is not the one in the test staged component. It is still an instance of a real ValidationController so the mock one never gets called.

Tried every other possible combination I can thing of to get the mock ValidationController into the test subject - no luck. Probably missing something really obvious. Any ideas?

Also failing to simply mock ValidationController as there are multiple exports from ‘aurelia-validation’ - ie, this won’t work:

```auto
 jest.mock('aurelia-validation');

```

Anyone know how to do that?

---

<div class="post-metadata">

**Author:** ![stevies](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/stevies/32/1039_2.png) [@stevies](https://discourse.aurelia.io/u/stevies)\
**Post date:** [October 8, 2018, 9:04pm UTC](https://discourse.aurelia.io/t/how-to-mock-validationcontroller-and-inject-into-component/1709/2 "2018-10-08T21:04:39Z")

</div>

Hmm. I think the `NewInstance.of` is is causing the problem:

```auto
@inject(NewInstance.of(ValidationController))
export class MyCustomThing {

```

If I remove that, and just do:

```auto
@inject(ValidationController)
export class MyCustomThing {

```

I get the mock into the test subject. However, the mock is crap because I have only mocked on of the many methods - `validate`. Test now errors with:

```auto
	TypeError: controller.registerBinding is not a function
	Error: Cannot call ComponentTester.dispose() before ComponentTester.create()

```

I am on the right track, I think. But still stuck with how to easily mock the `ValidationController`. I can do this and it works:

```auto
  let mockController = {
    validate: jest.fn().mockReturnValue({valid: true}),
    registerBinding: jest.fn(),
    resetBinding: jest.fn(),
    unregisterBinding: jest.fn(),
    reset: jest.fn()
  };

```

And then how to deal with injecting a mock when using `NewInstance.of` in the code.

Looks like this bug was closed without actually fixing the problem of mocking.

`https://github.com/aurelia/dependency-injection/issues/137`