testing: E2E for setting username field

guardian · Feb 8, 2024 · 68344c5 · 68344c5
1 parent ab3ad2f
commit 68344c5
Show file tree

Hide file tree

Showing 5 changed files with 23 additions and 5 deletions.
diff --git a/client/components/mma/identity/idapi/user.ts b/client/components/mma/identity/idapi/user.ts
@@ -198,8 +198,11 @@ export const read = async (): Promise<User> => {
 
 export const setUsername = async (user: Partial<User>): Promise<User> => {
 	const url = '/idapi/user/username';
-	const body = toUserApiRequest(user);
-	console.log('sending', body);
+	const body = {
+		publicFields: {
+			username: user.username,
+		},
+	};
 	try {
 		const response: UserAPIResponse = await fetchWithDefaultParameters(
 			url,

diff --git a/client/components/mma/identity/publicProfile/PublicProfile.tsx b/client/components/mma/identity/publicProfile/PublicProfile.tsx
@@ -60,7 +60,9 @@ export const PublicProfile = (_: { path?: string }) => {
 	const usernameDisplay = (u: User) => (
 		<>
 			<WithStandardTopMargin>
-				<PageSection title="Username">{u.username}</PageSection>
+				<PageSection title="Username">
+					<span data-cy="username-display">{u.username}</span>
+				</PageSection>
 			</WithStandardTopMargin>
 			<WithStandardTopMargin>
 				<Lines n={1} />

diff --git a/cypress/lib/signInOkta.ts b/cypress/lib/signInOkta.ts
@@ -16,6 +16,7 @@ export const signInOkta = () => {
 	cy.visit('/');
 	cy.createTestUser({
 		isUserEmailValidated: true,
+		doNotSetUsername: true,
 	})?.then(({ emailAddress, finalPassword }) => {
 		cy.get('input[name=email]').type(emailAddress);
 		cy.get('input[name=password]').type(finalPassword);

diff --git a/cypress/support/commands.ts b/cypress/support/commands.ts
@@ -97,6 +97,7 @@ type IDAPITestUserOptions = {
 	password?: string;
 	deleteAfterMinute?: boolean;
 	isGuestUser?: boolean;
+	doNotSetUsername?: boolean;
 };
 type IDAPITestUserResponse = [
 	{
@@ -128,6 +129,7 @@ export const createTestUser = ({
 	isUserEmailValidated = false,
 	deleteAfterMinute = true,
 	isGuestUser = false,
+	doNotSetUsername = false,
 }: IDAPITestUserOptions) => {
 	// Generate a random email address if none is provided.
 	const finalEmail = primaryEmailAddress || randomMailosaurEmail();
@@ -150,6 +152,7 @@ export const createTestUser = ({
 					password: finalPassword,
 					deleteAfterMinute,
 					isGuestUser,
+					doNotSetUsername,
 				} as IDAPITestUserOptions,
 			})
 			.then((res) => {

diff --git a/cypress/tests/e2e/e2e.cy.ts b/cypress/tests/e2e/e2e.cy.ts
@@ -16,9 +16,18 @@ describe('E2E with Okta', () => {
 	});
 
 	context('profile tab', () => {
-		it('should contain a username', () => {
+		it('should allow the user to set a username', () => {
+			const randomUsername = `testuser${Math.floor(
+				Math.random() * 100000,
+			)}`;
 			cy.visit('/public-settings');
-			cy.findByText('Username');
+			cy.get('input[name="username"]').type(randomUsername);
+			cy.findByText('Save changes').click();
+			cy.visit('/public-settings');
+			cy.get('span[data-cy="username-display"]').should(
+				'contain',
+				randomUsername,
+			);
 		});
 	});