SimoneB
SimoneB

Reputation: 178

Protractor: switchTo().frame issue, test gets blocked

I am trying to run a test of maximizing and minimizing a chat window and it is contained inside a iframe: HTML here.

the page with test is: chat_features.js

const customerURL = "https://vps-web-utils.awsbrandembassy.com/livechat-window-gherkin/"

let agent = browser;
let customer = browser.forkNewDriverInstance();

describe('First interaction customer-agent', () => {

    beforeAll(function() {
        agent.ignoreSynchronization = true;
        customer.ignoreSynchronization = true;
        customer.get(customerURL);
        agent.driver.manage().window().maximize();
        customer.driver.manage().window().maximize();
    });

    it('should maximize and minimize chat window', () => {
        let elm1 = customer.$('[class="be-chat-wrap be-chat-wrap--minimize"]');
        expect(elm1.isPresent()).toBe(true);
        elm1.click(); 
        customer.sleep(3000);  
        // switching to iframe 
        browser.switchTo().frame($('.be-chat-frame'));
        // customer.sleep(1000);
        // expect(elm1.isPresent()).toBe(false);
        // let elm2 = customer.$('.control-panel__icon.control-panel__icon--minimize');
        // expect(elm2.isPresent()).toBe(true);
        // elm2.click();
        customer.sleep(3000);
    });

});

while the conf.js file is this:

exports.config = {
  framework: 'jasmine',
  specs: ['chat_features.js'],
  multiCapabilities: [{
    browserName: 'chrome'
  }],
  directConnect: 'true'
}

It looks like that when introducing the switching command test fails, but we have no errors logged, browser windows keep open and you have to termine using CTRL+C

Upvotes: 0

Views: 688

Answers (2)

Brine
Brine

Reputation: 3731

Sorry, I thought your locator was fine... but it wasn't. The api states that you should use .getWebElement() with switchTo()... though fails to explain why.

Here's the key:

browser.switchTo().frame($('.be-chat-frame').getWebElement());

and here's your working code:

const customerURL = "https://vps-web-utils.awsbrandembassy.com/livechat-window-gherkin/";

describe('angularjs homepage', function() {

    beforeAll(function() {
        browser.ignoreSynchronization = true;
        browser.get(customerURL);
    });

    it('should maximize the chat window', () => {
        let elm1 = $('[class="be-chat-wrap be-chat-wrap--minimize"]');
        expect(elm1.isPresent()).toBe(true);
        elm1.click();  
    });

    it('should switch to iFrame and minimize chat window', function() {
        // switch to iframe
        browser.switchTo().frame($('.be-chat-frame').getWebElement());
        // minimizing windows
        let elm2 = browser.$('.control-panel__text');
        expect(elm2.isPresent()).toBe(true);
        elm2.click();  
        // Switch back to Default Content
        browser.switchTo().defaultContent();
    });
});

Upvotes: 0

SimoneB
SimoneB

Reputation: 178

I managed to find the solution, here is the code:

const customerURL = "https://vps-web-utils.awsbrandembassy.com/livechat-window-gherkin/"

describe('angularjs homepage', function() {

    beforeAll(function() {
        browser.ignoreSynchronization = true;
        browser.get(customerURL);
    });

    it('should maximize the chat window', () => {
        let elm1 = browser.$('[class="be-chat-wrap be-chat-wrap--minimize"]');
        expect(elm1.isPresent()).toBe(true);
        elm1.click();  
    });

    it('should switch to iFrame and minimize chat window', function() {
        // switch to iframe
        browser.switchTo().frame(browser.driver.findElement(protractor.By.css('.be-chat-frame')));
        // minimizing windows
        let elm2 = browser.$('.control-panel__text');
        expect(elm2.isPresent()).toBe(true);
        elm2.click();  
        // Switch back to Default Content
        browser.switchTo().defaultContent();
    });
});

The key is the syntax here:

browser.switchTo().frame(browser.driver.findElement(protractor.By.css('.be-chat-frame')));

Found the solution at this page: correct syntax

Upvotes: 1

Related Questions