diff --git a/test/e2e/ui/test/create-user.test.js b/test/e2e/ui/test/create-user.test.js
new file mode 100644
index 00000000..fdd75887
--- /dev/null
+++ b/test/e2e/ui/test/create-user.test.js
@@ -0,0 +1,18 @@
+import { test, expect } from '@playwright/test';
+
+test('Create user and save kubeconfig YAML to disk', async ({ page }) => {
+  /* SETUP */
+  const templateName = "developer";
+  const username = `test-user-${templateName}-${Date.now()}`;
+
+  await page.goto('/');
+  const createButton = await page.getByTestId('create-user');
+  await createButton.click();
+
+  await page.waitForURL('https://permission-manager.dev/create-new-user');
+  expect(page).toHaveURL(/.*create-new-user/);
+
+  const submitButton = await page.getByTestId('submit');
+
+  expect(submitButton).toBeVisible();
+});
diff --git a/web-client/src/views/CreateUser.tsx b/web-client/src/views/CreateUser.tsx
index f4b664da..92139990 100644
--- a/web-client/src/views/CreateUser.tsx
+++ b/web-client/src/views/CreateUser.tsx
@@ -209,9 +209,9 @@ const CreateUser = () => {
 
         // Call to define Cluster Resources Access
         clusterAccess !== 'none' && createClusterRoleBindings.mutate({
-          roleName: `template-cluster-resources___${clusterAccessOptions.find((c: clusterAccessOption) => c.id === clusterAccess).backendvalue}`,
+          roleName: `template-cluster-resources___${clusterAccessOptions.find((c: clusterAccessOption) => c.id === clusterAccess)?.backendvalue}`,
           subjects: [{kind: 'ServiceAccount', name: username, namespace: 'permission-manager'}],
-          clusterRolebindingName: `${username}___template-cluster-resources___${clusterAccessOptions.find((c: clusterAccessOption) => c.id === clusterAccess).backendvalue}`,
+          clusterRolebindingName: `${username}___template-cluster-resources___${clusterAccessOptions.find((c: clusterAccessOption) => c.id === clusterAccess)?.backendvalue}`,
         })
       ]).then(res => {
         console.log('calls done', res);
@@ -249,7 +249,7 @@ const CreateUser = () => {
                 <EuiFlexItem>
                   <EuiFlexGroup direction='row' justifyContent='spaceBetween'>
                     <EuiFlexItem grow={false}><EuiTitle><h3>User data</h3></EuiTitle></EuiFlexItem>
-                    <EuiFlexItem grow={false}><EuiButton fill isDisabled={!formIsFilled} onClick={handleSubmit}>CREATE</EuiButton></EuiFlexItem>
+                    <EuiFlexItem grow={false}><EuiButton fill isDisabled={!formIsFilled} onClick={handleSubmit} data-test-subj='submit'>CREATE</EuiButton></EuiFlexItem>
                   </EuiFlexGroup>
                 </EuiFlexItem>
 
diff --git a/web-client/src/views/UsersList.tsx b/web-client/src/views/UsersList.tsx
index 7e69388a..8531fb4a 100644
--- a/web-client/src/views/UsersList.tsx
+++ b/web-client/src/views/UsersList.tsx
@@ -67,7 +67,17 @@ const UsersList = () => {
                 iconType='users'
                 title={<h5>No users defined yet</h5>}
                 titleSize='s'
-                actions={<EuiButtonEmpty color="success" href='/create-new-user' iconSide='right' iconType="plus">Create New User</EuiButtonEmpty>}
+                actions={
+                  <EuiButtonEmpty
+                    color="success"
+                    iconType="plus"
+                    iconSide="right"
+                    href='/create-new-user'
+                    data-test-subj="create-user"
+                  >
+                    Create New User
+                  </EuiButtonEmpty>
+                }
               />
         }
       </EuiPageTemplate.Section>