page objects in selenium webdriver - selenium-webdriver

I have a question about page objects in selenium webdriver. our site is very dynamic with lots of ajax and various authentication states. How to define each page object BUT lets say I have figured that out and defined several page objects that represent our site.
How do you handle crossing from page to page? So I get a page object for my home page and one for my account page and one for my results page. Then I need to write a test that traverses all my pages to simulate a user performing multiple actions.
How do you obtain a HomePage object to create a new use, then get a account page object to go perform some simulated user actions and then get a result page object to verify those actions? Can it be done in a single script?

this question is similar to one posted here, which may have an answer to your question: Selenium Page Objects

Related

How should a React app (or any SPA) interact with a HATEOAS back-end?

The basic question is if there should be one HATEOAS entry point per page or one entry point for the entire app?
Most examples I have seen implement a single page with a HATEOAS backend, e.g. a list that is paginated using prev and next links. But what happens when the app navigates to a different page that has completely different capabilities and needs a different entry point? How does one organize such an app?
Concrete example: We have an app with tab navigation. The home tab shows a product catalog so the entry point is /products which returns page 1 of products along with pagination links. However, now I click on the orders tab which must show a list of past orders. This page needs a completely different entry point /orders which the home tab knows nothing about. In fact, user can directly navigate to the orders tab using a deep link.
How to think about this problem? Are there any examples illustrating an approach?
There's a few different ways to solve this. Here's two:
The SPA takes context from the uri (such as an id), and uses it to search on the API. The API can describe templated links/actions to search for resources by their id.
Instead of doing client-side routing, let the server decide what to render.
We're going more towards #2. If we have a uri such as:
https://spa.example/https://api.example/foo/bar
We take the path part of this uri and hit the API. Based on what the API responds with, we decide what to render. This means that most of the routing for these kinds of endpoints is delegated to the server, which feels more in line with HATEOAS.
The path part in this case is an entire absolute URI, but we also support relative uris and have a default base uri. So in practice these two uris are equivalent (for our SPA):
https://spa.example/https://api.example/foo/bar
https://spa.example/foo/bar
We develop & use ketting / react-ketting to do most of the heavy lifting

Rendering Just one module/state of Angular app

I've angular app with lots of states and modules etc. Now, I want to send a link to the user. When user'll hit this url, I want to redirect him to a new tab rendering only that particular state (specified in URL) i-e I don't want anything else to be visible to the user. Or you can say, I want to open a popup window rendering that particular state's html in popup window . This is the approach that comes to my mind to sort it out.
Ps. There are Rest APIs at the backend which I am calling through angular resource service to bind data with the model of the views
Option
I've rest APIs on backend, So, I was thinking to developing s separate Nodejs application, And I will send nodejs application url to the user and in the default/home route I'll call backend API and, the returned resultset will be rendered in html file within nodeJs application and this way, I'll render the corresponding data to user's browser window.
This is the flow for that
I don't know if that is right or clever approach. Please suggest me what will be the best approach to sort it out.
Thanks in advance.
This is what my app looks like
Everything in the left side-nav is a module and clicking on this I am routing to a different state. I am using angular-material and lots of other dependencies in this project.
And this is what I want.
I'll refer a link to the user for example www.myapp.com/specificpage.html. And hitting this url, a new tab/popup will be opened rendering state defined in the same app but with some non-editable url. And it should like.
There are multiple ways to achieve this and each approach has advantage and disadvantage. You have to choose depending on requirement and architecture. Details are below-
Create a separate app - You can do it through separate code base or use the module based build process and include this module only for new app.
Divide application is two part, public pages and private pages - Include this page and required APIs for this page in the public modules for your app.
Send token in the link - If you want to make secure page, send short lived token in the eMail and validate token on the server before displaying page to the user.

How to create module which can surpass authentication in angular js?

I have complete angular js working application.But i have a challenge ahead in that single page has to be made which will open on click of link.
Now the challenge for me is that if user is not logged in(Session not created) and someone trying to access any link it will redirect to login page,but in current case since i dont want user to be logged in and directly taken to that page and let him perform actions.
One simple solution for me was to create different application but i want to utilize the contents and code of current application.
Any one has faced any situation like this before,If yes then is there any possible way?

ng-admin redirect to specific page after element creation

I have a small admin page setup with ng-admin. Creating elements works without any issues.
What I want to achieve though is that I sent the user to a different page where he can perform some action that will alter the created item(scraping some data elsewhere for the element and asking if its correct).
Is there a way to overwrite the custom route that is on the submit button in ng-admin to sent the user to a custom page, also inside of ng-admin?
I would like to not tinker with the ng-admin code to not break the functionality on other elements pages.
Tere is no built-in way to do that in ng-admin 0.9. But a recent addition to the 1.0.0-dev branch (view.prepare()) might help you, see https://github.com/marmelab/ng-admin/pull/756.

How to make a login page outside the single page application skeleton

I have an angularJS single page application. It is an admin dashboard. However I do not want anyone to access the dashboard unless he is logged in.
Problem that I am facing is when I create a login template, it is usually part of the admin dashboard, since it is a single page application. However I want the login page to look completely different from the single page application index default view. Same for registration page.
What are ways to make a page different completely from the skeleton of the single page application with angular ?
I am sorry if the question is broad but I am new to angular. I do not care about any code written I just would like to understand a good technique for a sort of thing.
Feel free to send me any articles or documentations that explains similar technique
If I am understanding your question correctly, what you need to do is the following.
Use ui-router to control the navigation (or routing) in your application. Note that ui-router will become native in AngularJS 2, right now you will need to use NPM or Bower to include it in your project.
Then use the events it provides to determine if the user needs to logon before accessing the given route. If logon is required you can redirect to the logon page, the redirect back upon successful authentication.

Resources