Load aurelia-validation plugin during Jasmine unit tests - with webpack - aurelia

Question

I am using Aurelia with Webpack. Based on the ESNext Skeleton Webpack.
https://github.com/aurelia/skeleton-navigation/tree/master/skeleton-esnext-webpack
I have some plain JS model classes like:
import {ValidationRules} from 'aurelia-validation';
export class Address {
street = '';
}
ValidationRules
.ensure('street').required()
.on(Address);
As soon as I run my Jasmine tests (via Karma) and also with Wallaby, I get the error:
'Message: Did you forget to add ".plugin('aurelia-validation)" to your main.js?'
OK - I've not got a main.js when running tests, so how to load the plugin?
I've tried doing something like this - using aurelia-testing:
import {StageComponent} from 'aurelia-testing';
import {bootstrap} from 'aurelia-bootstrapper-webpack';
...
let component;
beforeEach(done => {
component = StageComponent
.withResources();
component.bootstrap(aurelia => {
aurelia.use.plugin('aurelia-validation')
});
done();
});
But that does not work with Webpack - open issue with aurelia-bootstrapper-webpack. Or maybe I am doing it wrongly.
Is there some other way to load the validation plugin during the tests? Or get aurelia-testing working with webpack?
At the moment, I am completely blocked from doing any unit tests if I have the validation plugin, or attempt to use aurelia-testing.

Answer 1

I have it working using the aurelia-cli and wallaby. You were very close which I guess makes it even more frustrating. The secret for me is that the validation plugin had to be bootstrapped first with the beforeAll method in the spec file and then the system under test created in the beforeEach method. The following spec file worked for me and resolved the Message: Did you forget to add ".plugin('aurelia-validation') to your main.js" error.
import { SourceSystemEntity } from '../../../src/entities/sourceSystemEntity';
import { StageComponent } from 'aurelia-testing';
import { bootstrap } from 'aurelia-bootstrapper';
describe('SourceSystem class', () => {
let component;
let sut: SourceSystemEntity;
beforeAll(done => {
component = StageComponent.withResources().inView('<div></div>').boundTo({});
component.configure = (aurelia: Aurelia) => {
aurelia.use
.standardConfiguration()
.plugin('aurelia-validation');
};
component.create(bootstrap).then(() => {
done();
});
});
afterAll(() => {
component.dispose();
});
beforeEach(() => {
sut = new SourceSystemEntity();
});
it('has Validation enabled', () => {
expect(sut.hasValidation()).toBeTruthy();
});
});

Answer 2

From what I've found the ValidationRules are run during the import process. Since they haven't been put into the actual class. What worked for me was to put the ValidationRules into the constructor or another method and call them after the bootstrap has run. Still hasn't fixed the functionality of Validation during tests but it does let you run the unit tests
import {ValidationRules} from 'aurelia-validation';
export class Address {
street = '';
constructor() {
ValidationRules
.ensure('street').required()
.on(Address);
}
}