I am starting to build a test suite for some of the elements in my app. At the top level I have a <my-app> element and in its template it uses a <my-session element to contol user logon and an <iron-media-query> element to define how long a string to use in the app header.
In order to get better control of the behavior of these two, and am building special test versions of them and using the replace('my-session').with('test-session') approach to alter them. I will also use the stub function to control the interaction with the test suite.
I have read completely through the docs on the polymer web site, but I cannot find out if you have to use replace and stub before or after you call fixture.
Can someone advise
I eventually found the answer
Both have to be called before the fixture is instantiated. The reason being is that stub changes the prototype element (ie after its been created but before its stamped into the dom, so its needs to do it before the fixture).
The replace function actually adds an entry into a map for use when the fixture is instantiated. So again it needs to be called before the fixture call.
As of today, the latest release of web-components-tester doesn't contain a fix that allows this to work on on highly nested elements (for instance I was trying to test my app level element and the app-toolbar in the app-header-layout was not being expanded when replace had been used) but the fix is in the master. As a temporary measure I copied the master version of browser.js into the copy in use in the bower_componenents/web-component-tester directory.
I think there is still a bug in some very complex layouts. I had a paper-toast with a dom-if template inside its content which I was trying to replace with a test version to act as a mock, which also had the tag in its template. This didn't work