diff --git a/client/src/components/header/header.component.jsx b/client/src/components/header/header.component.jsx
index d0683154e..db01c95a7 100644
--- a/client/src/components/header/header.component.jsx
+++ b/client/src/components/header/header.component.jsx
@@ -278,10 +278,12 @@ function Header({
     {
       key: "home",
       icon: <HomeFilled />,
+      id: "header-home",
       label: <Link to="/manage/">{t("menus.header.home")}</Link>
     },
     {
       key: "schedule",
+      id: "header-schedule",
       icon: <Icon component={FaCalendarAlt} />,
       label: <Link to="/manage/schedule">{t("menus.header.schedule")}</Link>
     },
@@ -293,16 +295,19 @@ function Header({
       children: [
         {
           key: "activejobs",
+          id: "header-active-jobs",
           icon: <FileFilled />,
           label: <Link to="/manage/jobs">{t("menus.header.activejobs")}</Link>
         },
         {
           key: "readyjobs",
+          id: "header-ready-jobs",
           icon: <CheckCircleOutlined />,
           label: <Link to="/manage/jobs/ready">{t("menus.header.readyjobs")}</Link>
         },
         {
           key: "parts-queue",
+          id: "header-parts-queue",
           icon: <ToolFilled />,
           label: <Link to="/manage/partsqueue">{t("menus.header.parts-queue")}</Link>
         },
@@ -314,6 +319,7 @@ function Header({
         },
         {
           key: "newjob",
+          id: "header-new-job",
           icon: <FileAddOutlined />,
           label: <Link to="/manage/jobs/new">{t("menus.header.newjob")}</Link>
         },
@@ -322,6 +328,7 @@ function Header({
         },
         {
           key: "alljobs",
+          id: "header-all-jobs",
           icon: <UnorderedListOutlined />,
           label: <Link to="/manage/jobs/all">{t("menus.header.alljobs")}</Link>
         },
@@ -330,6 +337,7 @@ function Header({
         },
         {
           key: "productionlist",
+          id: "header-production-list",
           icon: <ScheduleOutlined />,
           label: <Link to="/manage/production/list">{t("menus.header.productionlist")}</Link>
         },
@@ -341,6 +349,7 @@ function Header({
           ? [
               {
                 key: "productionboard",
+                id: "header-production-board",
                 icon: <Icon component={BsKanban} />,
                 label: <Link to="/manage/production/board">{t("menus.header.productionboard")}</Link>
               }
@@ -358,6 +367,7 @@ function Header({
               },
               {
                 key: "scoreboard",
+                id: "header-scoreboard",
                 icon: <LineChartOutlined />,
                 label: <Link to="/manage/scoreboard">{t("menus.header.scoreboard")}</Link>
               }
@@ -368,15 +378,18 @@ function Header({
     {
       key: "customers",
       icon: <UserOutlined />,
+      id: "header-customers",
       label: t("menus.header.customers"),
       children: [
         {
           key: "owners",
+          id: "header-owners",
           icon: <TeamOutlined />,
           label: <Link to="/manage/owners">{t("menus.header.owners")}</Link>
         },
         {
           key: "vehicles",
+          id: "header-vehicles",
           icon: <CarFilled />,
           label: <Link to="/manage/vehicles">{t("menus.header.vehicles")}</Link>
         }
@@ -390,21 +403,25 @@ function Header({
       ? [
           {
             key: "ccs",
+            id: "header-css",
             icon: <CarFilled />,
             label: t("menus.header.courtesycars"),
             children: [
               {
                 key: "courtesycarsall",
+                id: "header-courtesycars-all",
                 icon: <CarFilled />,
                 label: <Link to="/manage/courtesycars">{t("menus.header.courtesycars-all")}</Link>
               },
               {
                 key: "contracts",
+                id: "header-contracts",
                 icon: <FileFilled />,
                 label: <Link to="/manage/courtesycars/contracts">{t("menus.header.courtesycars-contracts")}</Link>
               },
               {
                 key: "newcontract",
+                id: "header-newcontract",
                 icon: <FileAddFilled />,
                 label: <Link to="/manage/courtesycars/contracts/new">{t("menus.header.courtesycars-newcontract")}</Link>
               }
@@ -417,6 +434,7 @@ function Header({
       ? [
           {
             key: "accounting",
+            id: "header-accounting",
             icon: <DollarCircleFilled />,
             label: t("menus.header.accounting"),
             children: accountingChildren
@@ -425,6 +443,7 @@ function Header({
       : []),
     {
       key: "phonebook",
+      id: "header-phonebook",
       icon: <PhoneOutlined />,
       label: <Link to="/manage/phonebook">{t("menus.header.phonebook")}</Link>
     },
@@ -436,6 +455,7 @@ function Header({
       ? [
           {
             key: "temporarydocs",
+            id: "header-temporarydocs",
             icon: <PaperClipOutlined />,
             label: <Link to="/manage/temporarydocs">{t("menus.header.temporarydocs")}</Link>
           }
@@ -443,21 +463,25 @@ function Header({
       : []),
     {
       key: "shopsubmenu",
+      id: "header-shopsubmenu",
       icon: <SettingOutlined />,
       label: t("menus.header.shop"),
       children: [
         {
           key: "shop",
+          id: "header-shop",
           icon: <Icon component={GiSettingsKnobs} />,
           label: <Link to="/manage/shop?tab=info">{t("menus.header.shop_config")}</Link>
         },
         {
           key: "dashboard",
+          id: "header-dashboard",
           icon: <DashboardFilled />,
           label: <Link to="/manage/dashboard">{t("menus.header.dashboard")}</Link>
         },
         {
           key: "reportcenter",
+          id: "header-reportcenter",
           icon: <BarChartOutlined />,
           label: t("menus.header.reportcenter"),
           onClick: () => {
@@ -469,6 +493,7 @@ function Header({
         },
         {
           key: "shop-vendors",
+          id: "header-shop-vendors",
           icon: <Icon component={IoBusinessOutline} />,
           label: <Link to="/manage/shop/vendors">{t("menus.header.shop_vendors")}</Link>
         },
@@ -480,6 +505,7 @@ function Header({
           ? [
               {
                 key: "shop-csi",
+                id: "header-shop-csi",
                 icon: <Icon component={RiSurveyLine} />,
                 label: <Link to="/manage/shop/csi">{t("menus.header.shop_csi")}</Link>
               }
@@ -493,6 +519,7 @@ function Header({
       children: [
         {
           key: "signout",
+          id: "header-signout",
           icon: <Icon component={FiLogOut} />,
           danger: true,
           label: t("user.actions.signout"),
@@ -500,6 +527,7 @@ function Header({
         },
         {
           key: "help",
+          id: "header-help",
           icon: <Icon component={QuestionCircleFilled} />,
           label: t("menus.header.help"),
           onClick: () => {
@@ -531,6 +559,7 @@ function Header({
           ? [
               {
                 key: "shiftclock",
+                id: "header-shiftclock",
                 icon: <Icon component={GiPlayerTime} />,
                 label: <Link to="/manage/shiftclock">{t("menus.header.shiftclock")}</Link>
               }
@@ -538,6 +567,7 @@ function Header({
           : []),
         {
           key: "profile",
+          id: "header-profile",
           icon: <UserOutlined />,
           label: <Link to="/manage/profile">{t("menus.currentuser.profile")}</Link>
         }
@@ -573,6 +603,7 @@ function Header({
     {
       key: "recent",
       icon: <ClockCircleFilled />,
+      id: "header-recent",
       children: recentItems.map((i, idx) => ({
         key: idx,
         label: <Link to={i.url}>{i.label}</Link>
@@ -586,6 +617,7 @@ function Header({
     imex: () => {
       menuItems.push({
         key: "beta-switch",
+        id: "header-beta-switch",
         style: { marginLeft: "auto" },
         label: (
           <Tooltip