Polymer 1.x unit testing spy not getting called - unit-testing

I have a piece of code which is doing some DOM manipulation calling functions like appendChild and RemoveChild.
so, say my component has a div tag with id property
<div id="header"></div>
Inside my component in one of the functions I am getting hold of the mentioned tag and appending something
this.$.header.appendChild('<div>Hello</div>')
In my unit test I create test fixture with the responsible component and then inside I create a spy like
var testSpy = sinon.spy(Polymer.dom($el.$.header), 'appendChild')
this is done inside my setup. And then inside my it block I check for the spy to be called. But it not getting called. Though the appendChild is being called and I could see the dom correctly as well. But in the expect it is not working. Any help?

So, I was able to figure it out on my own. The only different thing which I did was the way I was getting hold of my DOM while creating the spy:
var testSpy = sinon.spy($el.querySelector('#header'), 'appendChild')
After that my spy started to be called.

Related

What is the correct way to inject Emberdata in an Ember integration test

I have a component that expects a model property that is an ember data object (originally created from the route model)
I've tried this in the integration test but the store is undefined
test('it renders', function (assert) {
this.inject.service('store')
let model = this.get('store').createRecord('post');
this.set('model', model);
this.render(hbs`{{post-item-form model = model}}`);
assert.equal(this.$().text().trim(), 'Post your thoughts');
// Template block usage:
this.render(hbs`
{{#post-item-form}}
template block text
{{/post-item-form}}
`);
// assert.equal(this.$().text().trim(), 'template block text');
});
I would prefer to create a pure json object instead of creating a record through the usage of store in a component integration testing; because the component itself knows nothing about the store and you can just pass pure json object instead of a model instance to the component and it should still work. With this mindset, I would only deal with store in acceptance tests.
If you still would like to go the way you have mentioned; I believe you need to retrieve the store as follows:
var store = Ember.getOwner(this).lookup("service:store");
Since; auto run loops are disabled in testing mode by default; it is most likely that you will get an assertion error indicating that there is no run loop available when you run the following code let model = store.createRecord('post'); this means you need to wrap it in a within a run loop like Ember.run(()=>model = store.createRecord('post'));. I did not give a try to what I wrote; but I guess this should work.
Yet again; why do you need to create the record through store in an integration test? If you really like to use store; then an acceptance test should be better; since store will be up and running and you will not need to retrieve it through lookup. I hope this helps.

Spying a method which is in the tested module

To make it clear I'll 'draw' you a situation.
Module A(the same javascript file, at my case its reducer in ReactJS/Redux app) contains methods: First, Second
Im testing method First (inside which Second is called - and I want to check whether it has been called or not). So in pseudo code it looks like this:
creating a spy with sinon.spy(module1, 'Second')
invoking First()
checking whether its been called or not _createdSpy.should.have.calledOnce
The problem Ive encountered is that if the method Second is placed at the same module (file) as the First, it doesnt work (library doesnt detect if spy has been called). If I move it to the another file/module, it works just fine.
its by design or Im doing something wrong?
Im using sinon + chai + enzyme stack.

Custom ACTION as fixture member - google test

I want to execute an action every time a mock function is called. I tried implementing this using ACTION_P. See the code below:
ACTION_P(CompleteRegistrationWithStatus, status)
{
arg1->registrationCompleted(status);
}
And the expectation goes like:
EXPECT_CALL(*mockObj, register(_)).WillOnce(CompleteRegistrationWithStatus(success));
Problem is, I had to use the same expectation multiple times, just different status. So I needed to put the expectation inside a member function of the test fixture to avoid code redundancy. But the function cannot access the ACTION_P I defined since it is not a member of the fixture.
I tried searching for ACTIONs that are fixture members, like that of MATCHERs, but to no avail.
Any suggestions for a possible solution or alternative? Any form of help is much appreciated. TIA!
I'm not sure that I understand the need to put the expectation in a member function of the fixture, but you should be able to get the behavior you want using InSequence:
{
InSequence s;
EXPECT_CALL(*mockObj, register(_))
.WillOnce(CompleteRegistrationWithStatus(success));
EXPECT_CALL(*mockObj, register(_))
.WillOnce(CompleteRegistrationWithStatus(failure));
}

Unit testing a controller that invokes a method that checks the DOM for a property

I am writing a unit test for a controller where somewhere in the workflow checks the DOM for a specific property. Currently I am just mocking the method via
spyOn(controller, 'methodChecksDom').return('value that I want').
Works fine but how do I make the test pass without mocking that method. I've tried using $document and actually inserting dom via
$document.find('body').append('<div>...</div>')
but I get the following error in my test:
Error: Dirty test! DOM residue found in document body: ...
at Error (native)
What is the proper way of doing this. Testing the method without mocking it. Many Thanks!
If you're dead set on testing the DOM directly here, you need to clean up the inserted element after the test. That's why you're getting an error--you're not cleaning up the thing you inserted via $document.
That being said, you really should not be even so much as reading the DOM inside of a controller.
You should do any DOM manipulation or adding of behaviors by using a custom directive.
http://docs.angularjs.org/guide/directive
angular.module("myApp",[]).directive("mydirective",function(){
return {
link: function(scope,iElem,iAttrs) {
//Do stuff per instance here
}
}
})

unit/integration testing of controllers and views using MvcContrib throws error when run

Am fairly new to the world of testing MVC 4 Web Applications and have been attempting to unit test views and controllers to see whether for a given controller that an action renders a particular view, I have been using MvcContrib TestHelper to try to simply the process of testing the application but so far have been unable to get the test to pass.
When the test is run I receive the error Expected view name was 'index' actual was ''
Currently I am running this test method:
[TestMethod]
public void AMAC_Controller_Renders_Index_View()
{
var builder = new TestControllerBuilder();
var controller = new AMACController();
builder.InitializeController(controller);
var result = controller.Index();
result.AssertViewRendered().ForView("index").WithViewData<AMACEnquiryModel>();
}
the controller and model are both currently in use by the application, was wondering if you could give any advice on how get this test working, I have modified previously when I have done this I get another error that the route name already exists in the collection.
After getting some advice from one of the contributors of the MvcContrib project the reason the test wasn't passing was because I was passing the wrong data into the .ForView(), before I had .ForView("index") where the controller was actually passing View(model) so the value for .ForView() was actually an empty string so the assert now looks like this:
result.AssertViewRendered().ForView("").WithViewData<AMACEnquiryModel>();