Detox. Click on IOS native system pop-up doesn't work - detox

This is the confirmation alert pop-up I got after login into the application via google sso.
Native pop-up screenshot
And i've got the issue with clicking on 'Continue' button in this pop-up. I saw a few discussions already about this kind of issues, but nothing helped me.
This what i have tried - Detox: iOS Simulator how to confirm alert message, but it didn't work.
Also, I've opened an application in appium app to see the exact element name there, tried to use it in test, but didn't get any success.
Appium screenshot
This is the way how I interact with the element
it('should have welcome screen', async () => {
await expect(element(by.id('hostname-input'))).toBeVisible();
await element(by.id('hostname-input')).typeText('companyName');
await element(by.id('hostname-submit-button')).tap();
await element(by.id('googleAuthButton')).tap();
// XCUIElementTypeButton[#name="Continue"]
await waitFor(element(by.type('XCUIElementTypeButton')))
.toExist()
.withTimeout(10000);
await element(
by.name('Continue').and(by.type('XCUIElementTypeButton')),
).tap();
});
and this is the error:
Element matcher: ((!(kindOfClass('RCTScrollView')) && ((kindOfClass('(null)') && isNotNil) && !(kindOfClass('UIAccessibilityTextFieldElement')))) || (((kindOfClass('UIView') || respondsToSelector(accessibilityContainer)) && parentThatMatches(kindOfClass('RCTScrollView'))) && ((kindOfClass('UIView') || respondsToSelector(accessibilityContainer)) && parentThatMatches(((kindOfClass('(null)') && isNotNil) && !(kindOfClass('UIAccessibilityTextFieldElement')))))))
Any ideas on how that could be resolved?
Thanks in advance.

I wrote a helper function:
const alertsHelper = async (name) => {
await element(by.label(name).and(by.type('_UIAlertControllerActionView'))).tap();
};
export default alertsHelper;
Used like this:
await alertsHelper('Continue');

Related

React Native Fetch Blob/React Native Blob Util Fail in Production but not in Developer time

I am trying to download a pdf generated through an own api that worked normally for me until yesterday, since then it has stopped working without any modification. Reviewing in developer mode through the metro everything seems to work correctly without any problems (I download the pdf normally), but when deploying the application in the playstore it closes unexpectedly, leaving me without knowing why this happens.
First I was using the React Native Fetch Blob, then I used React Native Blob Util hoping it would solve the problem but it keeps happening. Do you guys have any ideas for why does this happen?
The PDF file download this function:
const generarReciboPdf = async (datosDeuda:FormularioScreenParams,formaPago:ReactText,nroCheque?:string) =>{
const{config,fs} = ReactNativeBlobUtil
if (formaPago === 4 && (nroCheque == ""|| undefined)) {
return console.log('debe llenar todos los campos');
}
const { DownloadDir } = fs.dirs;
const token = await AsyncStorage.getItem('token');
let datosDeudaCompleto= {
...datosDeuda,
forma_pago:formaPago,
nro_cheque:nroCheque
}
let url = 'https://sys.arco.com.py/api/appRecibos/generarReciboPdf/'+JSON.stringify(datosDeudaCompleto)
// return console.log(url);
const options = {
fileCache: true,
addAndroidDownloads: {
useDownloadManager: true, // true will use native manager and be shown on notification bar.
notification: true,
mime:'application/pdf',
path: `${DownloadDir}/recibo_${datosDeuda.mes_deuda.replace(/ /g, "")}_${datosDeuda.razon_social.replace(/ /g, "")}.pdf`,
description: 'Downloading.',
},
};
config(options).fetch('GET', url,{Authorization :'Bearer '+token}).then((res) => {
console.log('se imprimio correctamte el pdf');
setErrorPdf(1)
}).catch((error)=>{
console.log(error);
setErrorPdf(-1);
});
}
Also, this error appears in Play Console: "PlayConsole Error Image".
PlayConsole Error Image

Expo AuthSession immediately resolves as "dismiss"ed

I'm using Expo's AuthSession module to sign into Auth0:
let result = await AuthSession.startAsync({
authUrl: `${auth0Domain}/authorize?` + qs.stringify({
client_id: auth0ClientId,
response_type: 'code',
scope: 'openid profile email offline_access',
redirect_uri: redirectUrl,
code_challenge_method: 'S256',
code_verifier: codeVerifier,
state: oAuthState,
audience: auth0Audience
})
})
if (result.type === 'success') {
...
} else if (
result.type === 'dismiss' ||
(result.type === 'error' && result.errorCode === 'login-declined')
) {
// FIXME: alert never pops without delay here, despite the if correctly evaluating true
// Any way to check if the window has closed, if that's the issue?
await new Promise((resolve) => setTimeout(resolve, 5000))
let retry = await alertAsync(
'Authentication dismissed',
'Cancel signing in?',
'Try again',
'Exit'
)
return retry ? this.loginWithAuth0() : false
}
logger.error('Login failed', result)
throw new Error('Error signing in')
}
In a dev environment I never have an issue, but in a published app the promise often resolves immediately with { type: dismiss }, before the browser closes. Once I caught a glimpse of an alert (that I try to popup in case the session is actually dismissed) even before the AuthSession window opened.
If I add a 5s delay before popping the error up, it does show up 5s after starting the AuthSession rather than it finishing.
Testing on Android.
I looked into migration over to WebBrowser but it seems to be the same implementation.
Is there a consistent way to actually await the Auth process finishing, or should I ditch this whole thing and write my own login screen?
Thanks in advance for any input / direction!
I've put a detailed explanation of the problem and a possible solution https://github.com/expo/expo/issues/6679#issuecomment-570963717
As a temporary workaround, you can call AppState.currentState somewhere in your app, maybe logging it just to add the right listeners before the user clicks and enable the AuthSession (read more in the linked GitHub issue).
Have a look and comment please :)

Clear browser cookies React Native 0.60

My app is using Instagram's REST API, in order for a user to logout and login with a different account I have to clear the cookies for www.instagram.com from the browser. I have been using react-native-cookie with RN 0.59.10 and it has been working fine.
After upgrading to RN 0.60 I can't use the react-native-cookie or any of its alternate packages because they don't support auto-linking. The solution I have found is using the RCTNetworking module from the react-native library. You can see the solution here.
Code
var RCTNetworking = require('RCTNetworking');
export const logout = () => {
return new Promise((resolve, reject) => {
RCTNetworking.clearCookies(result => {
if (!result) {
console.log('Error Message');
reject()
}
store.dispatch({ type: "RESET_APP_STATE" });
NavigationService.navigate("AuthLoading");
resolve()
});
});
};
The code runs fine. The app's state is cleared and the user is navigated to the login screen, but when I open the Instagram page in the webView instead of asking for the username and password, it directly logs me in.
You should use the community-version of react-native-cookies which can be found here: https://github.com/react-native-community/react-native-cookies
I am happily using this in combination with version 0.61.5 of React-Native.

How to close the safari pop up dialogue when running automate script with nightwatch on 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?

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()
})