2

I want to be able to tab around on a page and get the focus of the element, but I got problems when trying to do so.

I have been using some code that I found here that I tried on google and it worked just fine. But I cant use the method on the page I am testing. The working code for Google.com:

describe('Test', () => {
  it('should browse to google', () => {
    browser.waitForAngularEnabled(false);
    browser.ignoreSynchronization = true;
    browser.driver.get('https://www.google.com');
    expect(browser.getCurrentUrl()).toEqual('https://www.google.com/');
  });

  it('should unfocus the search field', function () {
    const search = element(by.name('q'));
    search.sendKeys(protractor.Key.TAB);
    expect(element(by.css('.xPnqmf')).getAttribute('aria-label'))
      .toEqual(browser.driver.switchTo().activeElement().getAttribute('aria-label'));
  });
});

However, I can´t use this method on my own page that I am testing.

The code I am using for this angular built site:

const header = element(by.cssContainingText('Selector', 'Text'));
        header.sendKeys(protractor.Key.TAB);

I get the error message: - Failed: element not interactable But I am using the exact same element several times before I get to this point and its working fine. So I am completely lost how I should proceed from here :( Is there mabye another method that I can try?

Faldorn
  • 21
  • 3
  • first, confirm your locator find the desired element from page, second confirm your code wait enough time for page loading, – yong May 07 '19 at 05:08
  • The locator is working fine since i use the exact same locator about 5 times before I get to the tab stage. Thats why I am confused why I get the error message I get at this stage of the test. I have also tried to use long sleeps before and after the tab moment to see if that worked but unfortunately it did not. – Faldorn May 07 '19 at 06:50
  • please show the HTML code of the target element – yong May 07 '19 at 11:21
  • The HTML is very basic. There is a table that contains a table-header and that one contains a couple of table-header-columns. I am using the method "by.cssContainingText" to pick the table-header-column with that certain text. I am new at the job and they told me that its no good to copy the HTML code as it is here since there is too many names in it that they dont want to be seen here (working for the government). I am clicking on the same element several times before in the same test and it works fine. – Faldorn May 07 '19 at 11:41
  • I think yuor problem is that element you're using is not an input or textArea. Protractor sendKeys doesn't work other elements – Sergey Pleshakov May 07 '19 at 17:09
  • if @SergeyPleshakov is right, then your alternative is to a level down and js execute sending the key to the current window instead. – Jeremy Kahan May 08 '19 at 01:43
  • @SergeyPleshakov I think that you are correct. I have done some experiments now on different kind of elements and I get the same result just like you say. – Faldorn May 08 '19 at 08:05
  • @JeremyKahan That sounds like an idea. Do you have an idea how to code that? I tried to search for it, but I dont know if I am searching for the wrong words because I get similar questions like mine (how to send key tab with protractor the ordinary way, not to the current window). Cheers – Faldorn May 08 '19 at 08:17
  • I think I remembered wrong something I did like 3 summers ago and cannot find, because everything I read says what I said is impossible. I remember a page with a search feature but no search box, where if you just started typing keys, the box popped up and it jumped to an item on the list. Protractor with IE was unhappy doing that even though it worked fine interactively. But I guess maybe I sent the keys to the div or page or something higher level than the element. – Jeremy Kahan May 08 '19 at 11:19
  • see https://stackoverflow.com/questions/50286111/how-to-use-sendkeys-without-finding-element-on-web-page-when-element-is-alread – Jeremy Kahan May 08 '19 at 11:19

0 Answers0