How to get an element ful lxpath in WebdriverIO?

Question

I have the code that check if there is element which has the specific text is displayed under the container. It worked well, while I used full xpath, but after we changed selector (it still get the same element) doesn't work. How could I fix this?

async function (text, display, container) {
  const containerElement = await Elements[container].call();
  const element = await $(containerElement.selector.toString() + `//*[contains(text(), '${text}')]`);
  await component.checkDisplay(element, display);
});

selectorOld(){
    return $('/html/body/p-dynamicdialog/div/div/div[3]/something-element');
  },


selectorNew(){
    return $('something-element');
  },

Only one "something-element" exist on the site, and both the old and the new selector give back the same element.

I tried the following:

const element = await containerElement.$(`//*[contains(text(), '${text}')]`);

but its search in global, not just under the selector.

My other idea, its to get somehow the element xpath, but I didn't find way, how possibly is that.

Answer 1

The problem is that expression searched in all elements:

const element = await containerElement.$(`//*[contains(text(), '${text}')]`);

You have to add a dot, before the the forwards slashes to search under the element.

$(`.//*[contains(text(), '${text}')]`);