diff --git a/bbb-learning-dashboard/src/App.js b/bbb-learning-dashboard/src/App.js
index 95b922c1c8..01f4469fef 100644
--- a/bbb-learning-dashboard/src/App.js
+++ b/bbb-learning-dashboard/src/App.js
@@ -389,7 +389,7 @@ class App extends React.Component {
           }}
         >
           <TabsListUnstyled className="grid gap-6 mb-8 md:grid-cols-2 xl:grid-cols-4">
-            <TabUnstyled className="rounded focus:outline-none focus:ring focus:ring-pink-500 ring-offset-2">
+            <TabUnstyled className="rounded focus:outline-none focus:ring focus:ring-pink-500 ring-offset-2" data-test="activeUsersPanel">
               <Card>
                 <CardContent classes={{ root: '!p-0' }}>
                   <CardBody
@@ -420,7 +420,7 @@ class App extends React.Component {
                 </CardContent>
               </Card>
             </TabUnstyled>
-            <TabUnstyled className="rounded focus:outline-none focus:ring focus:ring-green-500 ring-offset-2">
+            <TabUnstyled className="rounded focus:outline-none focus:ring focus:ring-green-500 ring-offset-2" data-test="activityScorePanel">
               <Card>
                 <CardContent classes={{ root: '!p-0' }}>
                   <CardBody
@@ -456,7 +456,7 @@ class App extends React.Component {
                 </CardContent>
               </Card>
             </TabUnstyled>
-            <TabUnstyled className="rounded focus:outline-none focus:ring focus:ring-purple-500 ring-offset-2">
+            <TabUnstyled className="rounded focus:outline-none focus:ring focus:ring-purple-500 ring-offset-2" data-test="timelinePanel">
               <Card>
                 <CardContent classes={{ root: '!p-0' }}>
                   <CardBody
@@ -470,7 +470,7 @@ class App extends React.Component {
                 </CardContent>
               </Card>
             </TabUnstyled>
-            <TabUnstyled className="rounded focus:outline-none focus:ring focus:ring-blue-500 ring-offset-2">
+            <TabUnstyled className="rounded focus:outline-none focus:ring focus:ring-blue-500 ring-offset-2" data-test="pollsPanel">
               <Card>
                 <CardContent classes={{ root: '!p-0' }}>
                   <CardBody
diff --git a/bbb-learning-dashboard/src/components/UsersTable.jsx b/bbb-learning-dashboard/src/components/UsersTable.jsx
index a9ba3ff1da..16509bc701 100644
--- a/bbb-learning-dashboard/src/components/UsersTable.jsx
+++ b/bbb-learning-dashboard/src/components/UsersTable.jsx
@@ -233,7 +233,7 @@ class UsersTable extends React.Component {
                 const opacity = user.leftOn > 0 ? 'opacity-75' : '';
                 return (
                   <tr key={user} className="text-gray-700">
-                    <td className={`flex items-center px-4 py-3 col-text-left text-sm ${opacity}`}>
+                    <td className={`flex items-center px-4 py-3 col-text-left text-sm ${opacity}`} data-test="user">
                       <div className="inline-block relative w-8 h-8 rounded-full">
                         <UserAvatar user={user} />
                         <div
@@ -315,7 +315,7 @@ class UsersTable extends React.Component {
                         )) }
                       </div>
                     </td>
-                    <td className={`px-4 py-3 text-sm text-center items-center ${opacity}`}>
+                    <td className={`px-4 py-3 text-sm text-center items-center ${opacity}`} data-test="userOnlineTime">
                       <svg
                         xmlns="http://www.w3.org/2000/svg"
                         className="h-4 w-4 inline"
@@ -360,7 +360,7 @@ class UsersTable extends React.Component {
                         }())
                       }
                     </td>
-                    <td className={`px-4 py-3 text-sm text-center items-center ${opacity}`}>
+                    <td className={`px-4 py-3 text-sm text-center items-center ${opacity}`} data-test="userTotalTalkTime">
                       { user.talk.totalTime > 0
                         ? (
                           <span className="text-center">
@@ -383,7 +383,7 @@ class UsersTable extends React.Component {
                           </span>
                         ) : null }
                     </td>
-                    <td className={`px-4 py-3 text-sm text-center ${opacity}`}>
+                    <td className={`px-4 py-3 text-sm text-center ${opacity}`} data-test="userWebcamTime">
                       { getSumOfTime(user.webcams) > 0
                         ? (
                           <span className="text-center">
@@ -406,7 +406,7 @@ class UsersTable extends React.Component {
                           </span>
                         ) : null }
                     </td>
-                    <td className={`px-4 py-3 text-sm text-center ${opacity}`}>
+                    <td className={`px-4 py-3 text-sm text-center ${opacity}`} data-test="userTotalMessages">
                       { user.totalOfMessages > 0
                         ? (
                           <span>
@@ -429,7 +429,7 @@ class UsersTable extends React.Component {
                           </span>
                         ) : null }
                     </td>
-                    <td className={`px-4 py-3 text-sm col-text-left ${opacity}`}>
+                    <td className={`px-4 py-3 text-sm col-text-left ${opacity}`} data-test="userTotalEmojis">
                       {
                         Object.keys(usersEmojisSummary[user.userKey] || {}).map((emoji) => (
                           <div className="text-xs whitespace-nowrap">
@@ -445,7 +445,7 @@ class UsersTable extends React.Component {
                         ))
                       }
                     </td>
-                    <td className={`px-4 py-3 text-sm text-center ${opacity}`}>
+                    <td className={`px-4 py-3 text-sm text-center ${opacity}`} data-test="userRaiseHand">
                       { user.emojis.filter((emoji) => emoji.name === 'raiseHand').length > 0
                         ? (
                           <span>
@@ -470,7 +470,7 @@ class UsersTable extends React.Component {
                     </td>
                     {
                       !user.isModerator ? (
-                        <td className={`px-4 py-3 text-sm text-center items ${opacity}`}>
+                        <td className={`px-4 py-3 text-sm text-center items ${opacity}`} data-test="userActivityScore">
                           <svg viewBox="0 0 82 12" width="82" height="12" className="flex-none m-auto inline">
                             <rect width="12" height="12" fill={usersActivityScore[user.userKey] > 0 ? '#A7F3D0' : '#e4e4e7'} />
                             <rect width="12" height="12" x="14" fill={usersActivityScore[user.userKey] > 2 ? '#6EE7B7' : '#e4e4e7'} />
@@ -490,7 +490,7 @@ class UsersTable extends React.Component {
                         </td>
                       )
                     }
-                    <td className="px-3.5 2xl:px-4 py-3 text-xs text-center">
+                    <td className="px-3.5 2xl:px-4 py-3 text-xs text-center" data-test="userStatus">
                       {
                         Object.values(user.intIds)[Object.values(user.intIds).length - 1].leftOn > 0
                           ? (