Testing autoform with phantomjs - wierd problem

testing
1

Hi guys,

currently I am writing acceptence tests using chimp and I ran into a weird problem when testing an autoform.

IMPORTANT: This test works in chrome but NOT with phantomjs.

I have a collection that is rendered via autoform:

phones: {
  type: [Object],
  optional: true,
},
'phones.$.nr': {
  type: String,
},

Within my test I want to ADD a new phone-number and click the PLUS-button in the autoform. In phantomjs I am getting a Uncaught RuntimeError: Element is not currently interactable and may not be manipulated when trying to set a value via browser.setValue.

NOTE: Taking a screenshot via browser.saveScreenshot() shows that autoform DID NOT create a new field after the click.

This is the chimp code:

// Scenario: I can add a new phone-number via the autoform

// Given I have a list of phone-numbers (phones) with 1 field set.
// When I click the "PLUS"-button in order to ADD a new number
const addPhonesButton = `${formSelector} button.autoform-add-item[data-autoform-field="phones"]`
console.log(browser.isVisible(addPhonesButton))  // =true
browser.click(addPhonesButton)
browser.pause(2000)
// Then a new input field appears for me to enter the new phone-number
// NOTE: When I take a screenshot via browser.saveScreenshot() the autoform DOES NOT show a new input field!!!
const phoneInputField = `${formSelector} input[name="phones.1.nr"]`
console.log(browser.isExisting(phoneInputField))  // =true
console.log(browser.isVisible(phoneInputField))   // =false (!!!!)
browser.setValue(phoneInputField, '+1299288272')  // FAILS(!!!) WITH "Uncaught RuntimeError: Element is not currently interactable and may not be manipulated"

Any ideas whats going on?

2

PhantomJS causes weird issues all the time because it’s pretty old now. I suggest that you don’t use it :slight_smile:

If you insist, then you might want to check the console output from Phantom to debug. Usually you need to shim it with some library.

I would try to start phantomjs --webdriver --debug from the command line, then connect chimp to it using chimp --url=localhost port=xxxx.

3

Hi Sam,

thanks for the quick response. :slight_smile:

I am new to testing and at the beginning of implementing tests for my project. Right now I am trying to make tests compatible with chromedriver and phantomjs, because I am thinking that I need phantomjs-compatible tests for a CI-environment (p.e. in CircleCI).

Am I wrong with this assumption? If yes: would tests passing in chrome be compatible with CircleCI? Or am I messing things up here and chimp-tests won’t run on CircleCI anyways? :wink:

4

Sure thing

With Circle, you can just use Chrome out the box (or Firefox). They use Xvfb behind the scenes. Much better to use a real browser.

1 Like