within()/I.switchTo() fails in specific case: Either name or url matcher should be specified

[mirao]

It works well in 3.5.3
It's related to #3846, CC: @kobenguyent
In 3.5.4 I'm getting ERROR locator.toLowerCase is not a function and in 3.5.5 I'm getting Either name or url matcher should be specified

What are you trying to achieve?

The scenario should pass. Unfortunately I don't have a simplistic case, so I used a scenario from our production tests.

What do you get instead?

Provide console output if related. Use --verbose mode for more details.

  Teacher: Verify the kit's content
 › [Dir] /home/mirao/workspace/codeceptjs/tests/s4e
    I click #LESSON_MENU_KIT_CONTENT
  › <screenshotOnFail> Test failed, try to save a screenshot
  › Screenshot is saving to /home/mirao/workspace/codeceptjs/tests/s4e/output/Teacher__V_1695287237.failed.png
  ✖ FAILED in 2623ms
...
1) KitLesson
       Teacher: Verify the kit's content:
     Either name or url matcher should be specified
      at assert (/home/mirao/workspace/codeceptjs/node_modules/.pnpm/playwright-core@1.37.1/node_modules/playwright-core/lib/utils/debug.js:29:21)
      at Page.frame (/home/mirao/workspace/codeceptjs/node_modules/.pnpm/playwright-core@1.37.1/node_modules/playwright-core/lib/client/page.js:195:23)
      at Playwright.switchTo (/home/mirao/workspace/codeceptjs/node_modules/.pnpm/codeceptjs@3.5.5_e6w65ce3sp4lg2q5fzcoe2hnqu/node_modules/codeceptjs/lib/helper/Playwright.js:2573:32)

Provide test source code if related

function verifyKitLessonGlossary() {
    within(
        {
            frame: HtmlBodyPage.iFrame, // "(//iframe)[last()]"
        },
        () => {
            I.see(glossaryName, kitContentFragment.glossaryTerm); // locate(".glossary-term")
            // Open glossary popup
            I.click(kitContentFragment.glossaryTerm);
            // Verify content of popup
            I.see(glossaryName, glossaryTermInfoFragment.glossaryTermInfo);
            I.see(glossaryText, glossaryTermInfoFragment.glossaryTermInfo);
        }
    );
}

Scenario("Teacher: Verify the kit's content", () => {
    I.click(iPlannerPage.kitView.kitContent);

    verifyKitLessonGlossary();
});

Details

• CodeceptJS version: 3.5.5
• NodeJS Version: 18.15
• Operating System: Ubuntu 22.04
• Playwright 1.37.1

[mirao]

The simplistic scenario is (unfortunately can be reproduced on our product's page only).

Scenario("Teacher: Verify the kit's content", () => {
    I.click(iPlannerPage.kitView.kitContent);
    within(
        {
            frame: "//iframe",
        },
        () => { // No need to have any action here to reproduce the issue }
    );
});

  1) KitLesson
       Teacher: Verify the kit's content:
     Either name or url matcher should be specified
      at assert (/home/mirao/workspace/codeceptjs/node_modules/.pnpm/playwright-core@1.37.1/node_modules/playwright-core/lib/utils/debug.js:29:21)
      at Page.frame (/home/mirao/workspace/codeceptjs/node_modules/.pnpm/playwright-core@1.37.1/node_modules/playwright-core/lib/client/page.js:195:23)
      at Playwright.switchTo (/home/mirao/workspace/codeceptjs/node_modules/.pnpm/codeceptjs@3.5.5_e6w65ce3sp4lg2q5fzcoe2hnqu/node_modules/codeceptjs/lib/helper/Playwright.js:2573:32)

If you use frame: "iframe" instead of frame: "//iframe" as a context in the "within", the test passes

The iframe source of the page is

<iframe style="height: 251.826px; border-width: 0px;" src="blob:http://localhost:19006/92ea7cf1-0b62-4234-a2a2-239124b3d231"></iframe>

[kobenguyent]

I could not replicate the issue with the test web of CodeceptJS unfortunately, so don't know how to debug there.

may you try with "playwright": "1.35.1" as that is the one using with Playwright helper.

[mirao]

may you try with "playwright": "1.35.1" as that is the one using with Playwright helper.

I can reproduce even with Playwright 1.35.1

---

I tried to replace within() by

I.switchTo("(//iframe)[last()]")
// actions
I.switchTo()

but I'm getting the same error

1) KitLesson
       Teacher: Verify the kit's content:
     Either name or url matcher should be specified
      at assert (/home/mirao/workspace/codeceptjs/node_modules/.pnpm/playwright-core@1.35.1/node_modules/playwright-core/lib/utils/debug.js:29:21)
      at Page.frame (/home/mirao/workspace/codeceptjs/node_modules/.pnpm/playwright-core@1.35.1/node_modules/playwright-core/lib/client/page.js:195:23)
      at Playwright.switchTo (/home/mirao/workspace/codeceptjs/node_modules/.pnpm/codeceptjs@3.5.5_e6w65ce3sp4lg2q5fzcoe2hnqu/node_modules/codeceptjs/lib/helper/Playwright.js:2573:32)
  
  Scenario Steps:
  - I.switchTo("(//iframe)[last()]") at verifyKitLessonGlossary (./KitLesson_test.ts:78:7)
  - I.click(#LESSON_MENU_KIT_CONTENT) at Test.<anonymous> (./KitLesson_test.ts:421:7)

[kobenguyent]

May you try with any other test websites to see if your issue persists?

[mirao]

If you use frame: "iframe" instead of frame: "//iframe" as a context in the "within", the test passes

I noticed one thing: When I use a simple "iframe" then a scenario withI.see(text, element) passes 👍 , but a scenario with I.see(text) fails 👎 on a failure "unable to find text in that iframe" though I can see that the text is there in web element inspector. It looks like in such case scenario tries to find the text outside the iframe.

Teacher: Verify the kit's content
 › [Dir] /home/mirao/workspace/codeceptjs/tests/s4e
    I click #LESSON_MENU_KIT_CONTENT
    Within "{"frame":"iframe"}" ""
      I see "ATGlossaryName104795297840113", .glossary-term
      I click .glossary-term
      I see "ATGlossaryName104795297840113", {xpath: .//div[@id = 'glossary-term-info']}
      I see "ATGlossaryText525872729594238", {xpath: .//div[@id = 'glossary-term-info']}
      ✔ OK in 14419ms

 Teacher: Verify the kit's problem set
  › [Dir] /home/mirao/workspace/codeceptjs/tests/s4e
    I click #LESSON_MENU_PROBLEM_SET
    Within "{"frame":"iframe"}" ""
      I see "ATQuestion314508762954905"
  › <screenshotOnFail> Test failed, try to save a screenshot
  › Screenshot is saving to /home/mirao/workspace/codeceptjs/tests/s4e/output/Teacher__V_1695582141.failed.png
  ✖ FAILED in 50936ms

...
 1) KitLesson
       Teacher: Verify the kit's problem set:

      expected web application to include "ATQuestion314508762954905"
      + expected - actual

      - Schedule Courses Library  Myra100424667514591 Turner121174202602348 Courses  ATiPlanner316333607338454 (ATSection528746589846895)  ATKitLesson808023617767795 Instruments Student Classroom Kit Content Problem Set Homework Glossary ATPSET897172103465219 
      +ATQuestion314508762954905

When I test it in 3.5.3, everything works fine

[jmychasiw]

Just to add some information to around this error. I am seeing the same error on existing code using I.switchTo().

We were advised by @DavertMik to use switchTo over within wherever possible. So we have been using switchTo with success however I have found that my existing tests break when trying to CodeceptJS version 3.5.5

Enter Credit Card Number
      I switch to "#iframe-payment-gateway" 
      I wait for element {"css":"iframe[id^=spreedly-number-frame]"}, 10
      I switch to {"css":"iframe[id^=spreedly-number-frame]"}
  ✖ FAILED in 21059ms


-- FAILURES:

  1) Standard Checkout Flow
       Checkout Test 

     Either name or url matcher should be specified
      at assert (node_modules/playwright-core/lib/utils/debug.js:29:21)
      at Page.frame (node_modules/playwright-core/lib/client/page.js:195:23)
      at Playwright.switchTo (node_modules/codeceptjs/lib/helper/Playwright.js:2573:32)

[mirao]

I'm able to reproduce the issue "Either name or url matcher should be specified" with I.switchTo(), on a public page.
It passes with 3.5.3 and fails with 3.5.5

Follow this:

Feature("My");

const { I } = inject();

Scenario("test something", () => {
    I.amOnPage("https://www.geekdashboard.com/tools/iframe-tester/");
    I.fillField(locate("input").withAttr({ type: "url" }), "codecept.io");
    I.click(locate("input").withAttr({ type: "submit" }));
    I.wait(5);
    I.switchTo("iframe#iframe-content");
});

config:

export const config: CodeceptJS.MainConfig = {
    tests: "./*_test.ts",
    output: "./output",
    helpers: {
        Playwright: {
            browser: "chromium",
            url: "http://localhost",
            show: true,
        },
    },
    name: "my",
};

output:

$ codeceptjs run --debug
CodeceptJS v3.5.5 #StandWithUkraine
Using test root "/home/mirao/workspace/codeceptjs/tests/my"
Helpers: Playwright
Plugins: screenshotOnFail

My --
 › [Session] Starting singleton browser session
  test something
    I am on page "https://www.geekdashboard.com/tools/iframe-tester/"
    I fill field {xpath: .//input[@type = 'url']}, "codecept.io"
    I click {xpath: .//input[@type = 'submit']}
    I wait 5
    I switch to "iframe#iframe-content"
 › <screenshotOnFail> Test failed, try to save a screenshot
 › Screenshot is saving to /home/mirao/workspace/codeceptjs/tests/my/output/test_something.failed.png
  ✖ FAILED in 6447ms


-- FAILURES:

  1) My
       test something:
     Either name or url matcher should be specified
      at assert (/home/mirao/workspace/codeceptjs/node_modules/.pnpm/playwright-core@1.37.1/node_modules/playwright-core/lib/utils/debug.js:29:21)
      at Page.frame (/home/mirao/workspace/codeceptjs/node_modules/.pnpm/playwright-core@1.37.1/node_modules/playwright-core/lib/client/page.js:195:23)
      at Playwright.switchTo (/home/mirao/workspace/codeceptjs/node_modules/.pnpm/codeceptjs@3.5.5_e6w65ce3sp4lg2q5fzcoe2hnqu/node_modules/codeceptjs/lib/helper/Playwright.js:2573:32)
  
  Scenario Steps:
  - I.switchTo("iframe#iframe-content") at Test.<anonymous> (./My_test.ts:10:7)
  - I.wait(5) at Test.<anonymous> (./My_test.ts:9:7)
  - I.click({xpath: .//input[@type = 'submit']}) at Test.<anonymous> (./My_test.ts:8:7)
  - I.fillField({xpath: .//input[@type = 'url']}, "codecept.io") at Test.<anonymous> (./My_test.ts:7:7)
  - I.amOnPage("https://www.geekdashboard.com/tools/iframe-tester/") at Test.<anonymous> (./My_test.ts:6:7)
  
  Artifacts:
  - screenshot: /home/mirao/workspace/codeceptjs/tests/my/output/test_something.failed.png


  FAIL  | 0 passed, 1 failed   // 7s
Run with --verbose flag to see complete NodeJS stacktrace

[mirao]

I noticed one thing: When I use a simple "iframe" then a scenario withI.see(text, element) passes 👍 , but a scenario with I.see(text) fails 👎 on a failure "unable to find text in that iframe" though I can see that the text is there in web element inspector. It looks like in such case scenario tries to find the text outside the iframe.

I created a new issue for it: #3891