Google Maps location suggestions not selectable

[julianYaman]

Hello,

I would like to know if I can select an option of the Google Maps location suggestion list with this package. You can see an example of it below:

Is there any way to select them? If it was possible, it would allow me to automatically enter the details of the selected location in each field that you can see in the screenshot.

Kind regards Julian Yaman

[DigitalFlow]

Hi @julianYaman,

technically that should be possible. You can fall back to the _page reference to the playwright page object, then you can write the tests just like any other playwright test.

You should probably be able to find a css selector for referencing the suggestion which you want to click. You just need to be careful considering whether this suggestion is rendered inside an iframe or not.

It would be easier to access if it was not inside an iframe, but best to check upfront.

This could look something like this:

await _page.click("#elementIdOrSelectorOfSuggestion");
await xrmUiTest.waitForIdleness();

I hope this helps, otherwise just ask :)

Kind regards, Florian

[imartinflores]

@julianYaman you should be able to do what Florian suggested. That worked for me on a different scenario where I needed to interact with a newly opened tab. I needed to create a new page to work with it, something like:

let myNewPage: playwright.Page = null;

[myNewPage] = await Promise.all([ context.waitForEvent("page"), await xrmTest.Button.click({ byLabel: "Case Review" })

  `  ]);`
 `   await myNewPage.bringToFront();`

If you do not need to create a new one, you can rely on the "page" object at the beginning: .then(([b, c, p]) => { browser = b; context = c; page = p; });

@DigitalFlow , is there any way to make the XrmUITest object to allow "set" , so perhaps if a new page needs to be created we do not miss the XrmTest functionalities ? may be something like: XrmTest.page = myNewTab;

Thanks!

[julianYaman]

Hello, thank you very much for your answers. The solution of @DigitalFlow worked for me. I just had to click on the field with await page.click('[data-id=attribute]') to trigger the Google Maps autocomplete panel.

It seems that you can select the first entry of the autocomplete suggestions with await page.click(".pac-item >> nth=0"); (just wrote it here because it might help someone else)

Thanks again for your efforts, @DigitalFlow and @imartinflores!

My other problem at the moment is that I am trying to split the tests into different files, each for an entity. Is it possible to split them with this package? (because I also need page and xrmTest in the other files, right?)

[DigitalFlow]

@julianYaman: It is possible to split into multiple files, however you need to copy the bootstrap code for launching and closing the browser to the new files as well, since each file handles its init and shutdown code on its own.

Apart from that, all files inside your spec folder named xxxx.spec.ts will be found and executed by the jest test runner.

Hope that helps.

PS: Greetings to Pfullendorf, you're like 20km away from me :)

Kind regards, Florian

[julianYaman]

Hi @DigitalFlow, sending greetings back, especially from Frank who you may know 😄

I could try to create a "common" test / function to launch the browser and import it into other test files. This would mean, that I can export browser, context and page as well as xrmTest to use their values in the different test files. I think I need to figure this out more, but it already looks like, that I need to implement the basic setup for each test, like you already said.

[julianYaman]

Ok, after looking deeper into this, it looks like bad practice what I'm doing here 😄.

I think, I will try to combine repetitive tasks into functions to make the code look cleaner. This will still result into a massive one-file test, but at least it's readable.

[DigitalFlow]

Hi @julianYaman,

that sounds good, Greetings back to Frank as well :)

Kind regards, Florian

[DigitalFlow]

@imartinflores

@DigitalFlow , is there any way to make the XrmUITest object to allow "set" , so perhaps if a new page needs to be created we do not miss the XrmTest functionalities ? may be something like: XrmTest.page = myNewTab;

Thanks!

I think a set operation could be dangerous, as it might be that there are still playwright operations (promises) pending when you set it. I'd propose it differently: Add a new XrmUiTest constructor, which already takes a parameter for browser context and page object. That way you can get a new instance without danger of pending operations.

What do you think?

Kind regards, Florian

[imartinflores]

@DigitalFlow I think that sounds ok, I might need to dig a little bit more as I do not know how that works internally + I am just starting with TS , thanks for the suggestion!

[imartinflores]

@DigitalFlow I've updated the constructor in both .ts and .js files. constructor(settings?: TestSettings, myBrowser?: playwright.Browser, myContext?:playwright.BrowserContext, myPage?:playwright.Page)

I've also added a Set property for these 3 objects (Browser, Context and Page) in the same way than set settings(value: TestSettings); is done.

Is there something there I could be missing ?

When testing it out const xrmTest2 = await new XrmUiTest(null, browser, context, GdprCasePage);

xrmTest2.Button.click({byLabel: "Save"}) it throws "this._page.$ is not a function"

So I assume I am missing to set a value somewhere else but I could not find it. Any clue? Btw, could not debug it, I am experiencing some issues in VSCode so quite hard to find what's going on, will try to fix that first. Thanks!

[julianYaman]

Is it ok with you guys if I close this issue? My question on this issue was answered 😄

[imartinflores]

@julianYaman yes, go for it :) , glad it worked!

[julianYaman]

Thank you, @DigitalFlow and @imartinflores, for helping me 👍