Let us say my test wants to see if a user can see an image on XYZ page. And let's say in normal usage, the user can only go to XYZ page by clicking a link on ABC page (might be the home page).
Now assuming the URL to XYZ page is not static, but maybe depends on the image, and can be generated in the code simply, I have two ways of writing the test:
Generate the URL in test and directly navigate to XYZ, and then check if the image is present.
Go to ABC like a normal user would, click on the link which takes you to XYZ and then check for image
For option 1, I feel like I get more test isolation. If the link on ABC page is not generated correctly or is broken for some other reason, this particular test should not fail, right? That should be the responsibility of some other test?
But for option 2, that is how a real user would do it. He would almost never try to guess the pattern of the URL and then navigate to it directly. And I cannot have a huge test that goes to every link and sees if it is not broken, that would be way too complicated. So this much sacrifice in test isolation is needed.
How should I decide between the two options? Is there a right way? Hopefully the question is not too subjective for stackoverflow.
It depends on what you're wanting to test. If you want to test the buttons or links themselves (ie: you're testing the whole user workflow), click on them just like the user would.
If, on the other hand, clicking these links is just a means to an end and that the real target of the test case is deeper into the app, I think it's perfectly fine to skip directly to the part of the app you're actually testing.
As an End User, best approach will be the Option 2 which also widen the coverage of your test hence you can check:
1. Whether links/ buttons are clickable and not throwing exception.
2. Click on above is navigating to correct page.
Option 1, can be used for test scenario where user doesn't bother about how to reach to the page rather focused only on the opened page contents.
Choosing any of these option is depending on your approach of test coverage and its scope.
Related
I am very new to TestCafe, (but excited by what I see) so this might be a dumb mistake.
All the examples of TestCafe that I have found, depend on a single URL.
However, I want to test a very familiar sequence:
user makes some choices in page X and clicks submit,
user is shown multiple matching records in page Y, and clicks something in one result,
user sees a detail page Z, with full information for one record
When I try this in TestCafe, my test terminates when control leaves X. It never sees Y.
So, in the last lines of my test, after it submits page X
await t
.click(submitButton);
.. if I look for values which should be in page Y,
await t
.expect(Selector('#back-to-home-page').innerText)
.contains ('Back to Page X');
the Selector cannot find them. It only finds things still in page X.
(I have testcafe v 6.14, but this is not version-specific).
Thank you.
I'm not sure if I understand your question precisely, is page Y a different page that opens? (eg. you click on submit and page Y opens in a new tab / window)
See this for that: https://devexpress.github.io/testcafe/documentation/guides/advanced-guides/multiple-browser-windows.html
Also, judging by the last sample you provided, it might be the case that the element doesn't load fast enough?
Try something like:
await t
.expect(Selector('#back-to-home-page').innerText).contains('Back to Page X', {timeout: 20000})
See if the element is actually there before testcafe expects it.
Thank you for that idea Liviu.
My case is only in a single window, not multiple windows or tabs. Page X and Y are different URLS on the same domain: a form then a search results page. A completely typical flow.
I tried your good suggestion, but it did not work and now I know why.
For reasons unknown so far, the Page X submit button remains disabled even after TestCafe completes the required inputs. It is visible but greyed out. With human entry, this does not happen, only with TestCafe data entry. Some piece of JQuery validation is not getting triggered.
As newbie, before this, I did not know for sure if Testcafe could follow from page X to Page Y in any case, which would be an awful limitation. But I now have proved to myself that works, when I use TestCafe on other sites.
I can't solve the JQuery on my test site, and it is too detailed to post here. But I am happy to close the question.
Thank you guys.
Let me further explain.
You have a page where an application lives. However, upon first login, the user is prompted with a welcome screen that loads in the center of the browser. Like a pop-up from the application. This welcome screen is to help the user get familiar with the app. You can move on through the screens by reading the information and clicking the Continue button. After several of these pop-ups, the application will now be available for testing.
So how would I handle this in the Page Object Pattern using Selenium. Should I have a main page that just has functionality to navigate through these modals? Or should the main page return objects that represent each of the individual modals? Or should each modal be a separate page that I interact with?
Basically, I can think of several options:
ApplicationPage.Modal1.Continue();
or
Modal1.Continue();
Modal2.Continue();
or
ApplicationPage.ContinueThroughModal1();
or
ModalPage.Continue1();
ModalPage.Continue2();
I prefer to look at pages as collection of services. So
should the main page return objects that represent each of the individual modals?
PageObject helps you to improve the maintenance and reduces code duplication. So you can use it as an interface to a page of your AUT.
should each modal be a separate page that I interact with?
I would say - yes. If some future change occurs (in any modal), your PageObj will handle it without changing the test itself. Why not introduce a IModalPopup with Continue() method which will handle the skipping that your tests need. Further more in your MainPage class you can keep a ICollection<IModalPopup> welcomeScreens and iterate those.
Aiming at a full answer here - there is no need to actually go through this
welcome screen that loads in the center of the browser.
Once is enough. Every other test can utilize URL navigation over crawling each middle page. Single test that covers your end-user journey (by clicking required buttons/links) should be sufficient.
I start learning to write Cucumber test, and now I can write the test, but my test is too silly; I don't know I should focus what and ignore what. I always ask my co.op how to write a good test with Cucumber, and they give me some advices, but I feel not satisfy enough. So, please tell me about your opinion and give me some examples, thanks so much!
EDIT
I had an index page with a table, and 3 buttons(edit, detail, delete) in the last column each row of the table
and 1 button Create below the table, and the nav bar has a login form
So what thing I should check?
In my opinion, I think we shouldn't check login function and the content of the nav bar, because every page in this controller has the same layout
Maybe we should check total columns, total rows, the title, the icon css, the content of button, the css of whole page (border of table, width, height, font-family) ... Is this true?
I think you should prioritise the elements in your page, and check them.
As an example, when you test the login page:
Important elements of the login page
user name, password text boxes
login button
Not important elements (This all depends on your business requirement)
cancel button
other fancy text
etc..
and then in your Cucumber test, make sure you check the availability of user name, password text boxes and login button. The rest of the elements you can ignore. Otherwise you will be spending unnecessary time on testing non-important things.
Again, the priorities of your given page is depending on the business requirements of your project.
Im maintaining a site I didnt build thats for car insurance. In the banner of every page is an input that takes you to a page with a form to fill out. I cant understand why an input is used instead of a link, is there ever a valid and semantic reason for doing this?
Occasionally, people have done this because they want a link that "looks like a button". However, it is bad design.
It was never a good idea, but in the old days there was at least some justification for it: it gave a button feel and functionality to the link. However, with modern web design there is no need to do this: the same functionality can be created simply by styling a normal link appropriately.
On the other hand, this is probably more of a style issue than a real problem. It may not be worth changing it if you are maintaining an existing site.
using button or input type="button" is the original way to set up an Ajax request. that said, since it's taking the user to another page, sounds like they do not know what they are doing and/or wanted the styles that #dan1111 mentioned
A user logs into my application in a tab in a browser
They get an email and click a link which opens a new tab in the same browser and logs them in under a different email say.
If they go back to the first tab they are no longer the same user and I want the page to automatically detect this and then reload or redirect them if they are unauthorized to view the page.
Anyway to do this?
Or, if you really want to know when user is switched the tab, try this library:
visibility.js
As stated by #Hck:
add javascript code to reload page periodically (for example once per 30 seconds) – Hck
JavaScript is pretty much the only way to make pages do stuff after they're loaded. Note that in pretty much any user authentication system, a given browser will only be logged in as one user at a time, so as soon as the second tab opens, that browser will be acting as the second user - they can still see the current content of the first tab, but links (for instance) will no longer work unless the second user was also authorized to use them.
There are some JQuery plugins that do this sort of thing, like PeriodicalUpdater, or you can write your own (an example).