Playwright codegen is not recording the steps with iframe web app - playwright

I have a web app that is using frame on the login page, after login it will show the page with 3 iframes which has top page iframe, left side navigation iframe and right side iframe. I used playwright codegen to record the steps, it is able to record the login steps, but it is not recoding anything after logged in. Below is the code that playwright codegen records for the login steps only.
import { test, expect } from '#playwright/test';
test('test', async ({ page }) => {
await page.goto('http://url/%27);
await page.frameLocator('#authFrm').locator('#userName').fill('admin');
await page.frameLocator('#authFrm').locator('#userName').press('Tab');
await page.frameLocator('#authFrm').locator('input[name="pwd"]').fill('password');
await page.frameLocator('#authFrm').locator('input[name="pwd"]').press('Enter');
});
Also the playwright browser is not responding after logged in. I clicked the left side navigation link but the right side page is not loading that link. If I stop recording then the right side page is loading the link from the left side navigation link.
Anybody know why codegen is not recording the steps?

Related

angular Microsoft authentication library issue

I am using MICROSOFT AUTHENTICATION LIBRARY in our angular 10 project. I have used MSAL loginPopup() function to login the user in our active directory. But sometimes When I click the login function msal login pop appear and when I close the parent window it does not redirect in the next page stuck there and on the browser debugger console window it shows this error
(ERROR BrowserAuthError: hash_empty_error: Hash value cannot be processed because it is empty. Please verify that your redirect URI is not clearing the hash. Given Url:)
What worked for me in my ReactJS application was to set the redirectUri to a blank page or a page that does not implement MSAL. If your application is only using popup and silent APIs you can set this on the PublicClientApplication config like below:
export const msalConfig = {
auth: {
clientId: process.env.REACT_APP_CLIENTID,
authority: `https://login.microsoftonline.com/${process.env.REACT_APP_TENANTID}`,
redirectUri: 'http://localhost:3000/blank.html'
},
cache: {
cacheLocation: "localStorage"
}
}
If your application also needs to support redirect APIs you can set the redirectUri on a per request basis:
msalInstance.loginPopup({
redirectUri: "http://localhost:3000/blank.html"
})
After some research I found out that the problem was related to the redirect Uri, and most resources pointed to adding a blank page as the redirect Uri in a popup flow. However most of the answers were related to React. I tried a few options for adding a blank html page but it was not so simple. I did not want to waste much time on this issue, because the app is new and we might go with the redirect flow in the future.
Then I remembered that the problems started when we configured the home page, which is the redirect target, to be authenticated with MSAL Guard.
Since I couldn`t easily add a blank html page, I added a blank-page component configured in the Router with blank-page path. The component had no functionality and was not related to MSAL, MSAL Guard or MSAL Interceptor.
This solved it for me. I hope this helps.

Flutter Firebase Phone auth reCaptcha duplicate my login page after verification on iOS

I have a login page with juste one field for phone number and im using Firebase Phone Auth.
Everything is okay except when google reCaptcha appeared in the web browser (not google chrome and not Safari, just a web view), after verification, the web browser have to back to my login page but at this time, i see another login page (initState called) above my login page.
Is there anyway to detect at least when reCaptcha finished its job ?
Login function code:
Future login(String mobile) async
{
setState((){loginInProcess=true;sent=null;});
this.phoneNumber = mobile;
FirebaseAuth _auth = FirebaseAuth.instance;
_auth.setSettings(appVerificationDisabledForTesting:false);
_auth.verifyPhoneNumber(
phoneNumber: this.phoneNumber,
timeout: this.expiredCode,
verificationCompleted: _verificationCompleted,
verificationFailed: verificationFailed,
codeSent: codeSent,
codeAutoRetrievalTimeout: codeAutoRetrievalTimeout
).catchError((error){
setState((){loginInProcess=false;sent=false;});
});
}
i did not find any solution to listen to the event of validating reCaptcha...
i propose to use a testing variable in the login page... the second pushed page will not use this variable, so if it is null, show empty page or loading page until codeSent or verificationFailed is being fired.

Azure Ad Authentication expects me to refresh the main page every few hours

Recently I moved my Web App to Authenticate using our AzureAD but since then I need to refresh my home page every 1 hour to have it Authenticated else I am getting UnAuthorized Request.
I wanted to have this request mainly because I have a CCTV page where I will use this page in our common television for our Operation people to view the recent happenings on Onsite (This page won't be touched by anytime and this is just for viewing purpose). This CCTV page contains only images and I will refresh this page every 3 mins using the following Javascript. So the issue here is
My CCTV url is https://app.company.com/cctv and this page gets the data from API https://app.company.com/api/cctv. This was working fine until I move to AzureAD. Even in the AzureAD when I first open the page it works perfectly fine. But after around 1 hour my API returns UnAuthorizedResponse. Even if I try to refresh this CCTV page https://app.company.com/cctv it does not work. Authentication works only when I refresh the home page (https://app.company.com). I am not sure why this issue occurs.
Note: I have my both MVC controller and Web API controller in same
project
Please let me know if you can't understand my above explanation.
setTimeout(function () {
window.location.reload(1);
}, 180000);
I fixed the issue using the following code in Authentication Filter when I can't find the user data/profile.
filterContext.Result = new HttpUnauthorizedResult();
This actually redirects the page to do Authentication when I refresh that page.

Electron basic auth pop up not working

I am trying to open my node website inside electron app using its url, the node app has basic auth. The basic auth popup in electron app doesn't seem to work, any help is appreciated.
What doesn't work? By default Electron will cancel all authentications, so you need to add a listener for the login event to override the default behavior. Something like this:
app.on('login', (event, webContents, request, authInfo, callback) => {
event.preventDefault();
// popup a dialog to let the user enter a username/password
// ...
callback(username, password);
});

C2QB - OAUTH popup does not close, the application appears in the popup

In my application
1) the user clicks on the C2QB button
2) the OAUTH popup window appears
3) the user authorizes access to QB account
4) the authorization works
but...
the popup does not close. My application runs in the popup browser. The authorization works.
I can't figure out what I am doing wrong.
From the accessToken(and accessSecret) callback handler redirect to an intermediate page to close the child window and to take the control to the parent page.
<script type="text/javascript">
window.opener.location = '<%=APP_URL%>/home.htm';
window.close();
</script>
Thanks
I found what I was doing wrong. I was using Server.Transfer to go to new pages in my app instead of Response.Redirect. This causes the URL in the browser to not update. Which caused the window.close statement in OauthHandler to not execute. Thanks for your help.

Resources