How to close the safari pop up dialogue when running automate script with nightwatch on BrowserStack? - browserstack

I use Browserstack to do the E2E testing, now I met a problem when I try to run the mobile automate script in safari on Browserstack, there will have a pop-up dialogue show when I click a button which will result in opening a new tab, the dialogue show message like this: 'this site is attempting to open a popup window', I must close it and the script can continue executing.
Now the problem is:
1. When I click the button which will trigger this pop-up dialogue, there will always show an exception in the log: 'Error while running .clickElement() protocol action: Appium error: An unknown server-side error occurred while processing the command. Original error: Did not get any response after 20s'.
2. I can use the XPath to locate the button on the pop-up dialogue and click it to close the dialogue, but it takes serval minutes, is there another way to do this operation more efficient?
const { client } = require('nightwatch-api')
const { Given, Then, When} = require('cucumber')
Given('open mobile 163 news', async function () {
await client.url('https://3g.163.com/news/article/EJN99AOF000189FH.html?clickfrom=index2018_news_newslist#offset=0')
})
When('choose share by QQ', async function () {
await client.waitForElementVisible('.sharelogo')
await client.click('.sharelogo')
})
Then('the popup should show', async function () {
await client.waitForElementVisible('.qzone')
await client.click('.qzone')
await client.setContext('NATIVE_APP')
await client.source(function(res){
console.log(res.value)
})
await client.useXpath()
await client.click('//*[#name="Allow"]')
await client.contexts(function(result) {
client.setContext(result.value[result.value.length - 1])
client.useCss()
})
})

Have you tried adding the capability 'nativeWebTap' and setting it to the value 'true' in the test scripts?

Related

How can i click the following Button with puppeteer?

I'm trying to click a button on a website with puppeteer but it doesn't work for me.
Element-info:
<button aria-label="Alles akzeptieren" role="button" data-testid="uc-accept-all-button" class="sc-gtsrHT gqGzpd">OK</button>
My Code:
async function checkout(){
const browser = await puppeteer.launch({headless: false});
const page = await browser.newPage();
await page.goto(product_url);
await page.waitFor(3000);
await page.click("Button[class='sc-gtsrHT gqGzpd']", elem => elem.click());
}
Error Message:
Error: No node found for selector: Button[class='sc-gtsrHT gqGzpd']
at Object.assert (C:\Coding\Ticket-Bot\node_modules\puppeteer\lib\cjs\puppeteer\common\assert.js:26:15)
at DOMWorld.click (C:\Coding\Ticket-Bot\node_modules\puppeteer\lib\cjs\puppeteer\common\DOMWorld.js:277:21)
at processTicksAndRejections (internal/process/task_queues.js:95:5)
at async checkout (C:\Coding\Ticket-Bot\bayern.js:14:5)
Pictures:
https://i.stack.imgur.com/BYOnx.png (Button Info)
https://i.imgur.com/of9Rjgo.png (Button)
what is the correct code so that the button will be clicked?
You get the error due to the element does not exist on the page, it may be caused by the fact that CSS classes are autogenerated as #Sirko suggests.
You can even inspect the element's class name in DevTools if you launch puppeteer in headful mode.
You will need to find those selectors that will remain the same, e.g.:
await page.click('[aria-label="Alles akzeptieren"]');
await page.click('[data-testid="uc-accept-all-button"]');
Note: I am not sure if you need elem => elem.click() in the click options.

How do I deal with a page loading in a secondary browser tab when I run Protractor tests headless (Chrome)?

When this code clicks a “Print”-icon, a PDF-file will be generated and displayed in a new browser-tab. I want to switch to this tab, wait until the PDF has finished loading there, check a part of the URL and then close that secondary tab.
it( "should open document as PDF-file in new browser-tab", async () => {
const mUrl = "TherapyReportForm/Export";
await mTherapyReportView.btnPrintform.click();
await browser.getAllWindowHandles().then(async (handles) => {
//if there is a secondary browser-tab open...
if (handles.length > 1) {
//...click on it
await browser.driver.switchTo().window(handles[1]);
}
});
//confirm that the url of the secondary tab matches the print-url pattern
await browser.sleep( 18000 );
expect( await browser.getCurrentUrl() ).toContain( mUrl );
await browser.getAllWindowHandles().then( async (handles) => {
//if there are multiple browser-tabs open
if (handles.length > 1) {
//close the secondary and move back to first
await browser.driver.close();
await browser.driver.switchTo().window( handles[0] );
}
} );
} );
The test above works reliably, unless I run it in chromes headless-mode, then the test-run breaks at line
expect(await browser.getCurrentUrl()).toContain(mUrl);
console output
The console output proves that it switches to the secondary tab, but apparently never tries to load the url. Since it fails to close this secondary tab the entire suite will break at that point.
What am I doing wrong?
Here is a thing... downloading functionality is not available in headless chrome. That's for sure. What I'm going to talk about below, I'm a little bit uncertain if that's the case
There is no such thing as 'open' pdf file in browser. The reason is that behind scene the browser actually downloads it (maybe temporarily). This is why you'll never be able to do that in headless
But that's rather a shot in the dark

Testcafe - Unable to click on a button

I am trying to click on a button but for some weird reason, I am not able to. Here is the code.
import { ClientFunction } from 'testcafe';
import { Selector } from 'testcafe';
fixture `Fixture`
.page `https://viewshape.com/shapes/12b5ntdyuf7`
test(`test`, async t => {
await t.maximizeWindow();
await t.wait(3000);
const fullScreen = Selector('.sp-controls-btn.js-sp-fullscreen-button').filterVisible();
//await t.debug();
await t
.expect(fullScreen.with({visibilityCheck: true}).exists)
.ok({timeout: 30000})
.hover(fullScreen)
.click(fullScreen);
await t.wait(4000);
});
But if I go through debug mode using .debug() and then use Next-Action option in the debugger, the .click() works.
I am not able to understand what is going on here. Why is it .click() is working in .debug() but not in normal flow.
When the Testcafe click action is executed on a DOM element, it calls the element.click() method. Mentioned 'Failed to execute 'requestFullscreen' on 'Element' error means that click event handler calls the requestFullscreen method, which must be called inside a user interaction only. This is a browser's security restriction and there is no way to overcome it.

Office.context.mailbox.addHandlerAsync fails when reload the frame

I am implementing the pinnable taskpane in my outlook web add-in
This is my code:
Office.initialize = function (reason) {
$(document).ready(function () {
// Listen to ItemChanged event
Office.context.mailbox.addHandlerAsync(Office.EventType.ItemChanged, itemChanged, function (result) {
console.log(result)
if (result.status === Office.AsyncResultStatus.Failed) {
// here will be hit if I do a postback in the server, could also be replicated by choosing "reload frame" in the right click menu
{name: "Internal Error", message: "An internal error has occurred.", code: 5001}
}
});
gatherMailItemInfo();
});
}
Everything works fine( gatherMailItemInfo get calls when I switching between items. But as long as a do a post to the server ( can simply replicated by choosing "reload frame" in the right click menu) the handler will fail.
I am using office 365 for testing. Windows desktop client has no such issues.

Detox: Testing a React-Native spinner with a stop button

Was wondering if anyone has had a similar issue.
In the app I'm working with, we have a spinner showing downloading content with a stop button in the middle. When the user taps the spinner/stop button, the download is meant to cancel. For reference the spinner/stop button looks like this on iOS:
I'm trying to write an e2e test for this functionality using Detox. It doesn't work using automatic synchronisation as the animation (and the download) keeps the thread running. I've tried using device.disableSynchronization() but I haven't had any success.
Here's my e2e test for reference:
it('should start and then cancel a download from the <My Learning> screen', async() => {
// setup
await device.reloadReactNative()
await expect(element(by.id('feed_screen'))).toBeVisible()
await element(by.id('LearningPlan_Tab')).tap()
await expect(element(by.id('learning-plan-screen'))).toBeVisible()
// Tap the download icon, it will turn into a spinner
await element(by.id('offline_download_c2a')).atIndex(1).tap()
// Alert box appears with Cancel/Download options
await expect(element(by.label('Download')).atIndex(1)).toBeVisible()
await element(by.label('Download')).atIndex(1).tap()
// Ideally this would work, but it doesn't (the above alert box doesn't dismiss properly)
await device.disableSynchronization()
await waitFor(element(by.id('download_spinner_c2a')).atIndex(0)).toBeVisible().withTimeout(5000)
await element(by.id('download_spinner_c2a')).atIndex(0).tap()
await device.enableSynchronization()
await element(by.label('Cancel download')).tap()
await expect(element(by.id('offline_download_c2a')).atIndex(1)).toBeVisible()
})
When this test runs the app still seems to wait for the download to finish. Does anyone know any suggestions on the best way to test this, or if it's even possible?
I've found a way to make it work, though it seems quite flaky:
it('should start and then cancel a download from the <My Learning> screen', async () => {
//...
await device.disableSynchronization()
// This timeout seems to help
await waitFor(element(by.id('download_spinner_c2a')).atIndex(0)).toBeVisible().withTimeout(10000)
await element(by.id('download_spinner_c2a')).atIndex(0).tap()
await device.enableSynchronization()
await element(by.label('Cancel download')).tap()
await expect(element(by.id('offline_download_c2a')).atIndex(1)).toBeVisible()
})