wait for page load for non-angular Application using protractor - node.js

i am new to protractor and testing Non-Angular login Page and on clicking login button on login page a new page appears and i need to click on a planning link.But on clicking Login button application takes around 50 seconds.I want the protractor to wait untill the planning link appears.I used browser.wait(),browser.driver.implicitltyWait() but no success. I am able to click on planning link using browser.sleep() only.
Please help me to resolve the issue.

You need to wait for any WebElement in the page that is loaded after you perform login operation.
var EC = protractor.ExpectedConditions;
browser.wait(EC.visibilityOf(element(by.id("someId"))),60000)
it will wait for the element and throw exception after waiting for 1 minute

So what I understood from your question is that you have a non angular login page and click on login button takes you to another page(Is this angular or non angular?) which takes around 50 sec to load and contains a link(planning). Right?? And clicking on that link will take you to your angular home page.
And the issue which you are facing now is that the protractor is not waiting 50sec for the page containing the planning link to load.
Please try this and let me know the result..
this.clickLoginBtn = function () {
browser.driver.findElement(loginBtn).click();
return browser.wait(function () {
return browser.driver.isElementPresent(planningLink);
}, 50000);
};
I used browser.driver.findElement since we are on the non angular page.

I wrote a blog post about this, and have working examples on github, specifically when testing non-Angular apps. It makes use of Expected Conditions, and Page Objects.
If you're not using Page Objects yet, you'd do something like:
var EC = protractor.ExpectedConditions;
// Waits for the element with id 'loginBtn' to be clickable.
browser.wait(EC.elementToBeClickable($('#loginBtn')), 50000);

Related

How to get challenge key from a target website using geetest captcha

So I am scraping data from a target website using puppeteer.
Target website used geetest captcha, for anti-captcha, I am using 2capcta service,
on their documentation, it's mentioned that we need to get the challenge key every time.
From that the problem begins, target website has embedded the challenge key under
<Iframe>
<Html>
<head>
<script>
when accessing the iframe through DOM elements throw me a CORS error.
I have tried another way also which is available on the scraper box link is below
https://scraperbox.com/blog/solving-a-geetest-slider-captcha-with-puppeteer
it throws me no selector '[aria-label="Click to verify"]' found
it tried the codegrepper way link is below
https://www.codegrepper.com/code-examples/whatever/puppeteer+get+network+requests
throw me on console.error().
Any help would be appreciated to bypass geetest captcha
let me know also if my question is unclear.
Thank you so much for the answer,
so with the response by the above gentleman, the final solution is
when you load your page through puppeteer
await page.waitForSelector('iframe');
this will wait till the time iframe is loaded, now for me the target website has use the iframe with hash link to access it
const elementHandle = await page.$('iframe');
const frame = await elementHandle.contentFrame();
now the frame will have access to your iframe page, so you use the rest same like
await frame.waitForSelector("your selector")

How to automate visiting links then submitting a form?

I'm developing an extension that if opened in a specific page it will collect all forms links in that page, then it should visit each link and fill the form and submit it. i don't mind if it is visible or in the background.
I know how to do these separately:
collect the links
open a link
fill and send a form
but i need help on how can i combine those at once, visit all the links and fill/submit each one. any hint?
I'm looking to do something similar to what i can do with Selenium. but in chrome extension.
Try this:
1: inject the content script to the target page.
The script collect the links, and send the link addresses to background script (service worker) background.js by chrome.runtime.sendMessage().
2: Background script add listener for the message by chrome.runtime.onMessage.addListener(),
and the listener do the following for each link.
const tab = await chrome.tabs.create({url: <url_of_the_ilnk>})
chrome.scripting.executeScript({
target: {tabId: tab.id}, function:yourFunction
});
where, yourFunction() do fill and send form.

How to fill login prompt with Webdriver IO?

I'm working on a CLI with OCLIF. In one of the commands, I need to simulate a couple of clicks on a web page (using the WebdriverIO framework for that). Before you're able to reach the desired page, there is a redirect to a page with a login prompt. When I use WebdriverIO methods related to alerts such as browser.getAlertText(), browser.sendAlertText() or browser.acceptAlert, I always get the error no such alert.
As an alternative, I tried to get the URL when I am on the page that shows the login prompt. With the URL, I wanted to do something like browser.url(https://<username>:<password>#<url>) to circumvent the prompt. However, browser.url() returns chrome-error://chromewebdata/ as URL when I'm on that page. I guess because the focus is on the prompt and that doesn't have an URL. I also don't know the URL before I land on that page. When being redirected, a query string parameter containing a token is added to the URL that I need.
A screenshot of the prompt:
Is it possible to handle this scenario with WebdriverIO? And if so, how?
You are on the right track, probably there are some fine-tunings that you need to address to get it working.
First off, regarding the chrome-error://chromewebdata errors, quoting Chrome DOCs:
If you see errors with a location like chrome-error://chromewebdata/
in the error stack, these errors are not from the extension or from
your app - they are usually a sign that Chrome was not able to load
your app.
When you see these errors, first check whether Chrome was able to load
your app. Does Chrome say "This site can't be reached" or something
similar? You must start your own server to run your app. Double-check
that your server is running, and that the url and port are configured
correctly.
A lot of words that sum up to: Chrome couldn't load the URL you used inside the browser.url() command.
I tried myself on The Internet - Basic Auth page. It worked like a charm.
URL without basic auth credentials:
URL WITH basic auth credentials:
Code used:
it('Bypass HTTP basic auth', () => {
browser.url('https://admin:admin#the-internet.herokuapp.com/basic_auth');
browser.waitForReadyState('complete');
const banner = $('div.example p').getText().trim();
expect(banner).to.equal('Congratulations! You must have the proper credentials.');
});
What I'd do is manually go through each step, trying to emulate the same flow in the script you're using. From history I can tell you, I dealt with some HTTP web-apps that required a refresh after issuing the basic auth browser.url() call.
Another way to tackle this is to make use of some custom browser profiles (Firefox | Chrome) . I know I wrote a tutorial on it somewhere on SO, but I'm too lazy to find it. I reference a similar post here.
Short story, manually complete the basic auth flow (logging in with credentials) in an incognito window (as to isolate the configurations). Open chrome://version/ in another tab of that session and store the contents of the Profile Path. That folder in going to keep all your sessions & preserve cookies and other browser data.
Lastly, in your currentCapabilities, update the browser-specific options to start the sessions with a custom profile, via the '--user-data-dir=/path/to/your/custom/profile. It should look something like this:
'goog:chromeOptions': {
args: [
'--user-data-dir=/Users/iamdanchiv/Desktop/scoped_dir18256_17319',
],
}
Good luck!

Login to oauth dialog from facebook with puppeteer

I'm trying to interface a website, and one of the ways you can log on there is by using a Facebook login (it opens a pop-up, you can enter username/password or simply confirm if you're already logged on, you know the drill...).
Well, I'm trying to interface it with Puppeteer, and the strange thing is that I don't get the page. I mean, I'm working in non-headless mode so I can SEE the popup, it just looks like Puppeteer can't see it...
A lot of pages said to try something like this:
const newPagePromise = new Promise(x => browser.once('targetcreated', target => x(target.page())));
await page.click('<some selector>');
const popup = await newPagePromise;
But this doesn't give me a "popup" I can use (popup: null). I also tried to make it wait for 10s, but no luck then either...
When looking at all_pages: let all_pages = await browser.pages();, this array has 1 page. My original page... No Facebook popup. (But it is displayed on my screen!)
What am I missing here? How can I get this information in my automation process?
BTW: the Facebook popup also has 'Chrome is being controlled by automated test software.'. So I would assume I can reach this information somehow.
Thanks for any assistance!
browser is used to connect with Chromium, it is only called at the beggining. The same way you interact with the main page using const page = await browser.newPage(),
you have to use that same variable once the popup emerges as well, on the other hand,'targetcreated' is not the event you are looking for but 'popup'. Have in mind that page provides methods to interact with tabs, therefore, updating the code:
const newPagePromise = new Promise(event => page.once('popup', event));
This can be found in puppeteer documentation:
https://github.com/puppeteer/puppeteer/blob/v5.2.1/docs/api.md#event-popup

Flutter Web - How to reload currently Active Page

I am using Flutter for developing a website. Everything is working fine with Flutter except when it comes to reloading the page. When I press the refresh button in the browser, the whole web app gets reloaded.
For example, if I have navigated to four pages from the initial page, when I press the refresh button from the fourth page, the initial page gets loaded and I'll have to manually browse all the way to the fourth page again.
Is there any way to load the currently active page in Flutter?
Or you can just use this as it refreshes the whole window natively
import 'dart:html' as html;
html.window.location.reload();
Check out navigation with named routes as it maps URLs seamlessly when using Flutter Web.
EDIT : If you want URL parameters (like an id, a token...), check out this article.
Use Navigator to push to the same page. .ie.
If CurrentPage() is your page that needs to be refreshed then use:
Navigator.of(context).push(MaterialPageRoute(builder: (BuildContext context) => CurrentPage()));
This will reload the page.
import 'dart:html' as html;
html.window.location.reload();
as this is not allowed according to
https://dart-lang.github.io/linter/lints/avoid_web_libraries_in_flutter.html
this is how i have resolved my issue:
import this package
https://pub.dev/packages/universal_html/install
import whereever you want to use
import 'package:universal_html/html.dart' as html;
and you can use it like this
html.window.location.reload();

Resources