[SOLVED] cucumber-protactor-typescript correct way to set up sleep and element by css

cucumber-protactor-typescript correct way to set up sleep and element by css

I would like to click on a user-provided CSS string using protractor, cucumber, and typescript, however, the code I wrote does not seem to work here.

element(by.id(x)) works perfectly, however element(by.css(x)) doesnt

Steps.ts

import { Given, Then, When } from '
import {$, browser, by, element} from 'protractor';
import { FacebookPage } from '../../page_objects/pages/facebook/facebook.page';
import { expect } from '../support/expect';

let page:

Then(/^várok (.*) másodpercet$/, function (wait): number {
    browser.sleep(wait * 1000); //works fine but could you please provide a better solution?

});

Then(/^rákattintok (.*) id-val rendelkező gombra$/, async function     (idOfElement){
        await element(by.id(idOfElement)).click();
        return true; //works perfectly
});

Then(/^rákattintok (.*) css kóddal rendelkező gombra$/, async function     (idOfElement){
    return await element(by.css(idOfElement,)).click() //doesnt work at all
});

If necessary I can provide the cucumber code and my protractor config but I don't think it's necessary.

Error messege: NoSuchElementError: No element found using locator: By(css selector, href="/messages/t/")

Error messege at other times: InvalidSelectorError: invalid selector: An invalid or illegal selector was specified

I am sure that there is a href="/messages/t/" text

Solution

In order to select and click an element by HREF using protractor, do the following:

Then(/^rákattintok (.*) css kóddal rendelkező gombra$/, async function (href) {
    const anchor = await element(by.css(`[href="${href}"]`));
    await anchor.click();
});