diff --git a/tests/frontend/helper/ui.js b/tests/frontend/helper/ui.js
index d83cbee97..0f3e64169 100644
--- a/tests/frontend/helper/ui.js
+++ b/tests/frontend/helper/ui.js
@@ -77,7 +77,49 @@ helper.settingsMenu = function () { return helper.padChrome$('#settings'); };
  *
  * @returns {HTMLElement} the settings button
  */
-helper.settingsButton = function () { return helper.padChrome$("button[data-l10n-id='pad.toolbar.settings.title']"); };
+helper.settingsButton = function () {
+  return helper.padChrome$("button[data-l10n-id='pad.toolbar.settings.title']");
+};
+
+/**
+ * Toggles user list
+ */
+helper.toggleUserList = async function () {
+  const isVisible = helper.userListShown();
+  const button = helper.padChrome$("button[data-l10n-id='pad.toolbar.showusers.title']");
+  button.click();
+  await helper.waitForPromise(() => !isVisible);
+};
+
+/**
+ * Gets the user name input field
+ *
+ * @returns {HTMLElement} user name input field
+ */
+helper.usernameField = function () {
+  return helper.padChrome$("input[data-l10n-id='pad.userlist.entername']");
+};
+
+/**
+ * Is the user list popup shown?
+ *
+ * @returns {boolean}
+ */
+helper.userListShown = function () {
+  return helper.padChrome$('div#users').hasClass('popup-show');
+};
+
+/**
+ * Sets the user name
+ *
+ */
+helper.setUserName = async (name) => {
+  const userElement = helper.usernameField();
+  userElement.click();
+  userElement.val(name);
+  userElement.blur();
+  await helper.waitForPromise(() => !helper.usernameField().hasClass('editactive'));
+};
 
 /**
  * Gets the titlecross icon
diff --git a/tests/frontend/specs/change_user_name.js b/tests/frontend/specs/change_user_name.js
index e144a2340..0b9132f80 100644
--- a/tests/frontend/specs/change_user_name.js
+++ b/tests/frontend/specs/change_user_name.js
@@ -2,70 +2,33 @@ describe('change username value', function () {
   // create a new pad before each test run
   beforeEach(function (cb) {
     helper.newPad(cb);
-    this.timeout(60000);
   });
 
-  it('Remembers the user name after a refresh', function (done) {
-    this.timeout(60000);
-    const chrome$ = helper.padChrome$;
+  it('Remembers the user name after a refresh', async function () {
+    helper.toggleUserList();
+    helper.setUserName('😃');
 
-    // click on the settings button to make settings visible
-    const $userButton = chrome$('.buttonicon-showusers');
-    $userButton.click();
+    helper.newPad({ // get a new pad, but don't clear the cookies
+      clearCookies: false,
+      cb() {
+        helper.toggleUserList();
 
-    const $usernameInput = chrome$('#myusernameedit');
-    $usernameInput.click();
-
-    $usernameInput.val('John McLear');
-    $usernameInput.blur();
-
-    setTimeout(() => { // give it a second to save the username on the server side
-      helper.newPad({ // get a new pad, but don't clear the cookies
-        clearCookies: false,
-        cb() {
-          const chrome$ = helper.padChrome$;
-
-          // click on the settings button to make settings visible
-          const $userButton = chrome$('.buttonicon-showusers');
-          $userButton.click();
-
-          const $usernameInput = chrome$('#myusernameedit');
-          expect($usernameInput.val()).to.be('John McLear');
-          done();
-        },
-      });
-    }, 1000);
+        expect(helper.usernameField().val()).to.be('😃');
+      },
+    });
   });
 
+  it('Own user name is shown when you enter a chat', async function () {
+    helper.toggleUserList();
+    helper.setUserName('😃');
 
-  it('Own user name is shown when you enter a chat', function (done) {
-    const inner$ = helper.padInner$;
-    const chrome$ = helper.padChrome$;
+    helper.showChat();
+    helper.sendChatMessage('O hi{enter}');
 
-    // click on the settings button to make settings visible
-    const $userButton = chrome$('.buttonicon-showusers');
-    $userButton.click();
-
-    const $usernameInput = chrome$('#myusernameedit');
-    $usernameInput.click();
-
-    $usernameInput.val('John McLear');
-    $usernameInput.blur();
-
-    // click on the chat button to make chat visible
-    const $chatButton = chrome$('#chaticon');
-    $chatButton.click();
-    const $chatInput = chrome$('#chatinput');
-    $chatInput.sendkeys('O hi'); // simulate a keypress of typing JohnMcLear
-    $chatInput.sendkeys('{enter}'); // simulate a keypress of enter actually does evt.which = 10 not 13
-
-    // check if chat shows up
-    helper.waitFor(() => chrome$('#chattext').children('p').length !== 0 // wait until the chat message shows up
-    ).done(() => {
-      const $firstChatMessage = chrome$('#chattext').children('p');
-      const containsJohnMcLear = $firstChatMessage.text().indexOf('John McLear') !== -1; // does the string contain John McLear
-      expect(containsJohnMcLear).to.be(true); // expect the first chat message to contain JohnMcLear
-      done();
+    await helper.waitForPromise(() => {
+      // username:hours:minutes text
+      const chatText = helper.chatTextParagraphs().text();
+      return chatText.indexOf('😃') === 0;
     });
   });
 });