Unit tests
tomwayson opened this issue · comments
So the beauty of using the esri loader is that we should not have do all the crazy crap you need to do to load ArcGIS API for JavaScript modules in karma. We should be able to mock the esriLoader and the modules it returns. Better still, this app should include a service to handle all things map related and then component tests could mock that service.
I spent the last few evenings working on the testing issue with webpack and karma. I still haven't figured out what's going on past it seems to be things are running out of order.
Every reference to the esri modules fails, and then I get
ReferenceError: Can't find variable: define at karma-test-shim.js.
This branch has the problem code test code. You'll notice I pulled the esri api into a vendors folder. Initially I was wanting to hook into those files so I could run my tests while off the network, however that's looking less likely... I don't really feel this issue thread is a great place to throw this but not sure how else to get ahold of you. Does ESRI have a gitter chanel, I haven't found one that looks active?
Tonight I finally had time to dig into what you are doing with the EsriLoaderClass. Personally I like the concept :) My feeling is that in a large code base it'd actually be easier to work with. I'm planning a larger scale Angular 2 app, and I'm thinking that esri-dojo widgets will get wrapped into angular2 components and customized. Then the components will talk to each other through the angular2 component interface. I could see that working pretty well with the esri component loader.
@dgwaldo I think you're on the right path.
The best practice of pushing dependencies to the edge of your application is especially true for the ArcGIS API due to all this Dojo module loading nonsense. So, my general approach when developing an app w/ Angular (or any framework) is to create one (or very few) services that are the only parts of the application that can load or use the ArcGIS classes. Then inject that service into the components that need to show the widgets (map, legend, ect). So for example, the map component would just pass a DOM node to a function on a map service that creates the map, like:
this.map = this.mapService.createMap(this.mapEl.nativeElement, { center: [-118, 34.5], zoom: 8 });
That way testing components is just a matter of handing them a stub of that service and your tests never end up using the ArcGIS API.
I haven't created the map service in this repo yet. Once I do that and have the tests all set up w/ the mocks, I'll mark this as resolved.
In the mean time, I do have tests running w/o using the ArcGIS API being loaded or used by mocking the . See esri-map.component.spec.ts.
Closing this b/c the test has been created. If #15 ever lands, then those tests will be updated and hopefully a little more clear.