[SAML NewDot] Add SAML flow for web, mweb, desktop by NikkiWines · Pull Request #28372 · Expensify/App

NikkiWines · 2023-09-28T07:46:54Z

Details

Adds support for signing in with SAML on web and mweb.

Fixed Issues

$ #28215
$ #28216
PROPOSAL: N/A Internal

Tests

(Internal)
(for Web, mWeb, desktop)

Follow steps in https://github.com/Expensify/Web-Expensify/pull/38972 to get set up with SAML locally
Configure your account to have SAML enabled but not required in oldDot
Enter the email for your account in newDot
Confirm you see the option to choose to sign in with SAML or with a magic code
Choose the Go Back option and confirm you're dropped back on the sign-in page with your email pre-filled
Press Continue
Choose the Use Magic Code option and confirm you get a magic code sent to your email
Press Go Back and confirm you're back on the sign-in page with your email pre-filled
Press Continue
Choose Use Single Sign On option
Confirm you briefly see an interstitial page about launching your SSO provider's login portal
(web/mweb only) Navigate back to the root page (i.e. localhost:8082/ or new.expensify.com)
(web/mweb only) Confirm you land on the page with the option to choose to sign in with SAML or with a magic code
(web/mweb only) Choose Use Single Sign On option
Enter your SSO credentials
Confirm you're redirected back to New Expensify and are logged into your account
In oldDot, set SAML to required
In a new incognito window, open New Expensify and enter your email address
Confirm you're automatically redirected to your SSO providers login page (with the interstitial page being briefly shown)
(web/mweb only) Navigate back to the root page (i.e. localhost:8082/ or new.expensify.com)
(web/mweb only) Confirm you land on the sign-in page without your login prefilled
(web/mweb only) Enter the email for a non-SAML account and confirm you're directed to the magic code view for that login
(web/mweb only) Click go back and enter your SAML required login once again.
(web/mweb only) Confirm you're automatically redirected to your SSO providers login page
Enter your credentials and confirm you're successfully logged into New Expensify

(for ios/android)

Log into the same account you used in step 17 above
Confirm you see an error showing that you cannot log into an account with SAML required

(External)
(for Web, mWeb, Desktop)

Create an account with a validated domain on expensify.com
Configure your account to have SAML enabled but not required
Enter the email for your account in New Expensify
Confirm you see the option to choose to sign in with SAML or with a magic code
Choose the Go Back option and confirm you're dropped back on the sign-in page with your email pre-filled
Press Continue
Choose the Use Magic Code option and confirm you get a magic code sent to your email
Press Go Back and confirm you're back on the sign-in page with your email pre-filled
Press Continue
Choose Use Single Sign On option
Confirm you briefly see an interstitial page about launching your SSO provider's login portal
(web/mweb only) Navigate back to the root page (i.e. localhost:8082/ or new.expensify.com)
(web/mweb only) Confirm you land on the page with the option to choose to sign in with SAML or with a magic code
(web/mweb only) Choose Use Single Sign On option
In expensify.com, set SAML to required
In a new incognito window, open New Expensify and enter your email address
Confirm you're automatically redirected to your SSO providers login page (with the interstitial page being briefly shown)
(web/mweb only) Navigate back to the root page (i.e. localhost:8082/ or new.expensify.com)
(web/mweb only) Confirm you land on the sign-in page without your login prefilled
(web/mweb only) Enter the email for a non-SAML account and confirm you're directed to the magic code view for that login
(web/mweb only) Click go back and enter your SAML required login once again.
(web/mweb only) Confirm you're automatically redirected to your SSO providers login page

(for ios/android)

Log into the same account you used in step 16 above
Confirm you see an error showing that you cannot log into an account with SAML required

Offline tests

Navigate to the login page for New Expensify and enter your email
Confirm you see the
Disable your wifi or disable your network connections
Confirm you see the offline indicator

QA Steps

Same as test steps

Verify that no errors appear in the JS console

PR Author Checklist

Screenshots/Videos

Web

SAML Required Flow

web-required.mov

SAML Enabled Flow

web-enabled.mov

Mobile Web - Chrome

SAML Required Flow

SAML Enabled Flow

Simulator.Screen.Recording.-.iPhone.14.-.2023-09-28.at.17.01.20.mp4

Mobile Web - Safari

SAML Required Flow

mweb-required.mp4

SAML Enabled Flow

mweb-enabled.mp4

Desktop

SAML Required Flow

desktop-required.mov

SAML Enabled Flow

desktop-enabled.mov

iOS

SAML Required Flow

Simulator.Screen.Recording.-.iPhone.14.-.2023-10-12.at.18.36.53.mp4

(SAML Enabled is the same as the current magic code flow)

Android

SAML Required Flow

(SAML Enabled is the same as the current magic code flow)

…t-web

…bview

…agic code

melvin-bot · 2023-09-28T07:46:59Z

@situchan @ One of you needs to copy/paste the Reviewer Checklist from here into a new comment on this PR and complete it. If you have the K2 extension, you can simply click: [this button]

src/languages/en.ts

src/pages/signin/SignInPage.js

src/pages/signin/ValidateCodeForm/BaseValidateCodeForm.js

src/pages/signin/SAMLEnabledForm.js

src/languages/es.ts

src/pages/signin/SignInPage.js

situchan · 2023-09-28T10:45:06Z

Lint is failing

Is it ready for external review or wait until https://github.com/Expensify/Web-Expensify/pull/38972 is deployed?

MonilBhavsar · 2023-09-28T10:46:07Z

I think this should be on HOLD until Web-E PR is deployed. But yes, It can be reviewed

NikkiWines · 2023-09-28T10:56:53Z

@situchan you can review the portions under the (external) section in the Tests for now but the actual redirect to the SAML provider and then back to New Expensify won't work until the internal PR is deployed to prod

src/languages/en.ts

src/languages/es.ts

src/pages/signin/SAMLEnabledForm.js

src/pages/signin/SAMLSignInPage/index.js

situchan

Am I missing any config? I am trying to follow External step but I am not able to reach SAML page on web. I enabled permission in Permissions.ts

Screen.Recording.2023-10-02.at.7.48.12.AM.mov

situchan · 2023-10-02T01:55:13Z

src/pages/signin/SAMLSignInPage/index.js

+
+function SAMLSignInPage(props) {
+    useEffect(() => {
+        window.open(`${CONFIG.EXPENSIFY.SAML_URL}?email=${props.credentials.login}&referer=${CONFIG.EXPENSIFY.EXPENSIFY_CASH_REFERER}`, '_self');


It's possible that this page can be accessed on native when newDotSAML beta enabled and window.open will crash.

App/src/pages/signin/SignInPage.js

Lines 92 to 96 in 4308871

// SAML is temporarily restricted to users on the beta or to users signing in on web and mweb

if (Permissions.canUseSAML() || platform === CONST.PLATFORM.WEB) {

shouldShowSAMLEnabledForm = hasAccount && hasLogin && isSAMLEnabled && !isSAMLRequired && isUsingSAMLLogin;

shouldInitiateSAMLLogin = hasAccount && hasLogin && isSAMLRequired;

}

🤔 why would it crash? credentials.login is the only portion we'd need to be defined and we'll only show the SAMLEnabledForm (now ChooseSSOOrMagicCode) or intiaite the SAML login (i.e. navigate to that URL immediately) if the login is set.

NikkiWines · 2023-10-13T17:33:46Z

Updated once more!

situchan · 2023-10-13T17:51:15Z

Code looks good. (lint failing)

I started testing with private domain email.

Configure your account to have SAML enabled but not required

Where can I enable this?

NikkiWines · 2023-10-14T02:09:14Z

Where can I enable this?

In expensify.com under Settings > Domains > [Your Domain] > SAML

situchan · 2023-10-15T12:31:34Z

Where can I enable this?

In expensify.com under Settings > Domains > [Your Domain] > SAML

I don't find Domains in Settings. Can you please share that url?

MonilBhavsar

This is open since long. So going to merge this now.
There is an issue with transitioning which will hopefully be fixed by #28984. If not, we can address it in a separate PR

OSBotify · 2023-10-16T16:02:16Z

✋ This PR was not deployed to staging yet because QA is ongoing. It will be automatically deployed to staging after the next production release.

kavimuru · 2023-10-16T21:44:49Z

@NikkiWines @MonilBhavsar Are QA steps internal?

OSBotify · 2023-10-16T21:48:00Z

🚀 Deployed to staging by https://github.com/MonilBhavsar in version: 1.3.85-0 🚀

platform	result
🤖 android 🤖	success ✅
🖥 desktop 🖥	success ✅
🍎 iOS 🍎	success ✅
🕸 web 🕸	success ✅

NikkiWines · 2023-10-17T10:56:57Z

@kavimuru since qa@expensifail.com has a OneLogin account set up this doesn't need to be internally tested! However, if the please revert the expensifail.com domain to "SAML enabled" once testing is done 🙇

NikkiWines · 2023-10-17T10:57:14Z

I'll also do some testing on staging just to try things out

NikkiWines · 2023-10-17T13:59:57Z

The redirect back to NewExpensify isn't working for me on staging, but I think it might be that we need to test this on prod 🤔 looking at the logs now

NikkiWines · 2023-10-17T17:18:51Z

Going to hide these changes behind a beta so we can test on prod without it causing issues for customers - #29798

sakluger · 2023-10-17T19:07:51Z

I commented on the beta PR, but I don't think a beta is necessary. Ideally we can test this in a day or so, and I can't think of many downsides to having it accessible to real customers. Worst case, they run into errors and we fix the bug.

OSBotify · 2023-10-17T23:12:45Z

🚀 Deployed to production by https://github.com/francoisl in version: 1.3.85-4 🚀

platform	result
🤖 android 🤖	success ✅
🖥 desktop 🖥	success ✅
🍎 iOS 🍎	failure ❌
🕸 web 🕸	success ✅

OSBotify · 2023-10-17T23:58:54Z

🚀 Deployed to staging by https://github.com/MonilBhavsar in version: 1.3.86-0 🚀

platform	result
🤖 android 🤖	failure ❌
🖥 desktop 🖥	success ✅
🍎 iOS 🍎	success ✅
🕸 web 🕸	success ✅

OSBotify · 2023-10-18T23:56:24Z

🚀 Deployed to production by https://github.com/francoisl in version: 1.3.86-5 🚀

platform	result
🤖 android 🤖	success ✅
🖥 desktop 🖥	success ✅
🍎 iOS 🍎	failure ❌
🕸 web 🕸	success ✅

roryabraham · 2023-11-19T17:06:06Z

src/pages/LogInWithShortLivedAuthTokenPage.js

-)(LogInWithShortLivedAuthTokenPage);
+export default withOnyx({
+    account: {key: ONYXKEYS.ACCOUNT},
+    session: {key: ONYXKEYS.SESSION},


The session prop appears unused. Do you know if it's needed here?

We can remove it most probably. Seems like we removed the usage, but forgot to remove this key here. /cc @NikkiWines to be double sure

Ah yes, we can remove this 👍 I can do that as part of #29526 unless you'd like to make a separate PR fro it @roryabraham

@NikkiWines if you want to do it as part of #29526 that would be great!

alitoshmatov · 2024-03-20T18:07:20Z

src/pages/signin/SAMLSignInPage/index.js

+    const {translate} = useLocalize();
+
+    useEffect(() => {
+        window.open(`${CONFIG.EXPENSIFY.SAML_URL}?email=${credentials.login}&referer=${CONFIG.EXPENSIFY.EXPENSIFY_CASH_REFERER}`, '_self');


window.open broke route history and user couldn't go back from SAML page. ref: #29825

NikkiWines added 9 commits September 26, 2023 15:25

add SAMLEnabledForm

7f9875e

update SignInPage to route to SAMLEnabledForm and SAMLSignInPage

b7f9376

add SAMLSignInPage and routing

0551e55

add beta and consts

a4b6622

add routing for SAML required flow

e619191

Merge branch 'main' of github.com:Expensify/App into nikki-saml-newdo…

66a46b4

…t-web

add updated copy for SAML sign in page

75e4482

redirect back to SignInPage instead of showing ValidateCodePage in su…

31222f1

…bview

fix login redirecting when SAML enabled user opts to sign in with a m…

f99cf33

…agic code

NikkiWines requested a review from MonilBhavsar September 28, 2023 07:46

NikkiWines requested a review from a team as a code owner September 28, 2023 07:46

NikkiWines self-assigned this Sep 28, 2023

melvin-bot bot requested review from situchan and removed request for a team September 28, 2023 07:46

NikkiWines added 2 commits September 28, 2023 16:57

add saml spanish translations

f144da8

minor style and props validation

0c74b4a

MonilBhavsar reviewed Sep 28, 2023

View reviewed changes

include login in useEffect dependency array

464f2dd

NikkiWines changed the title ~~[SAML NewDot] Add SAML flow for web and mweb~~ [HOLD][SAML NewDot] Add SAML flow for web and mweb Sep 28, 2023

minor style and linting fixes

bf8f5d4

sakluger reviewed Sep 29, 2023

View reviewed changes

src/languages/en.ts Outdated Show resolved Hide resolved

sakluger reviewed Sep 29, 2023

View reviewed changes

src/languages/es.ts Outdated Show resolved Hide resolved

NikkiWines added 2 commits September 29, 2023 12:21

update copy

4b08ced

prettier style

4308871

situchan suggested changes Oct 2, 2023

View reviewed changes

situchan reviewed Oct 2, 2023

View reviewed changes

remove unused import

b793275

MonilBhavsar mentioned this pull request Oct 16, 2023

fix: fix transitioning issue from old dot #28984

Merged

59 tasks

MonilBhavsar approved these changes Oct 16, 2023

View reviewed changes

MonilBhavsar merged commit febc3cf into main Oct 16, 2023

MonilBhavsar deleted the nikki-saml-newdot-web branch October 16, 2023 15:54

OSBotify mentioned this pull request Oct 16, 2023

Deploy Checklist: New Expensify 2023-10-16 #29717

Closed

NikkiWines mentioned this pull request Oct 17, 2023

[SAML NewDot][CP Staging] Hide SAML changes behind beta #29798

Closed

59 tasks

francoisl mentioned this pull request Oct 17, 2023

[HOLD for payment 2023-10-25] [HOLD for payment 2023-10-24] Login - User is not automatically logged in with magic link in different tab #29807

Closed

6 tasks

francoisl mentioned this pull request Oct 17, 2023

Log in - There is no error message when trying to log in into an account with SAML required #29819

Closed

6 tasks

lanitochka17 mentioned this pull request Oct 17, 2023

[HOLD for payment 2024-03-18] [$1000] Desktop - There is no turning back from the SSO provider #29825

Closed

6 tasks

melvin-bot bot mentioned this pull request Oct 17, 2023

[HOLD for payment 2023-10-24] SAML SSO in NewDot - Web and mobile web UI #28215

Closed

OSBotify mentioned this pull request Oct 17, 2023

Deploy Checklist: New Expensify 2023-10-17 #29837

Closed

roryabraham reviewed Nov 19, 2023

View reviewed changes

NikkiWines mentioned this pull request Dec 1, 2023

Add iOS and Android view for SAML Login #29526

Merged

47 tasks

alitoshmatov reviewed Mar 20, 2024

View reviewed changes

	// SAML is temporarily restricted to users on the beta or to users signing in on web and mweb
	if (Permissions.canUseSAML() \|\| platform === CONST.PLATFORM.WEB) {
	shouldShowSAMLEnabledForm = hasAccount && hasLogin && isSAMLEnabled && !isSAMLRequired && isUsingSAMLLogin;
	shouldInitiateSAMLLogin = hasAccount && hasLogin && isSAMLRequired;
	}

Conversation

NikkiWines commented Sep 28, 2023 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Details

Fixed Issues

Tests

Offline tests

QA Steps

PR Author Checklist

Screenshots/Videos

Uh oh!

melvin-bot bot commented Sep 28, 2023

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

situchan commented Sep 28, 2023

Uh oh!

MonilBhavsar commented Sep 28, 2023

Uh oh!

NikkiWines commented Sep 28, 2023 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

situchan left a comment

Choose a reason for hiding this comment

Uh oh!

situchan Oct 2, 2023 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

NikkiWines Oct 2, 2023

Choose a reason for hiding this comment

Uh oh!

NikkiWines commented Oct 13, 2023

Uh oh!

situchan commented Oct 13, 2023

Uh oh!

NikkiWines commented Oct 14, 2023

Uh oh!

situchan commented Oct 15, 2023

Uh oh!

MonilBhavsar left a comment

Choose a reason for hiding this comment

Uh oh!

OSBotify commented Oct 16, 2023

Uh oh!

kavimuru commented Oct 16, 2023

Uh oh!

OSBotify commented Oct 16, 2023

Uh oh!

NikkiWines commented Oct 17, 2023

Uh oh!

NikkiWines commented Oct 17, 2023

Uh oh!

NikkiWines commented Oct 17, 2023

Uh oh!

NikkiWines commented Oct 17, 2023 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

sakluger commented Oct 17, 2023

Uh oh!

OSBotify commented Oct 17, 2023

Uh oh!

OSBotify commented Oct 17, 2023

Uh oh!

OSBotify commented Oct 18, 2023

Uh oh!

roryabraham Nov 19, 2023

Choose a reason for hiding this comment

NikkiWines commented Sep 28, 2023 •

edited

Loading

NikkiWines commented Sep 28, 2023 •

edited

Loading

situchan Oct 2, 2023 •

edited

Loading

NikkiWines commented Oct 17, 2023 •

edited

Loading