diff --git a/springwolf-ui/src/app/components/header/header.component.html b/springwolf-ui/src/app/components/header/header.component.html
index 019f4081d..d60d9c370 100644
--- a/springwolf-ui/src/app/components/header/header.component.html
+++ b/springwolf-ui/src/app/components/header/header.component.html
@@ -44,13 +44,21 @@ <h1 class="width-s-hide">{{ title }}</h1>
         }
       </mat-menu>
 
-      <button mat-menu-item (click)="toggleIsShowBindings()">
+      <button
+        mat-menu-item
+        (click)="toggleIsShowBindings()"
+        data-testid="settings-bindings"
+      >
         <mat-icon>{{
           isShowBindings ? "check_box" : "check_box_outline_blank"
         }}</mat-icon>
         Show bindings
       </button>
-      <button mat-menu-item (click)="toggleIsShowHeaders()">
+      <button
+        mat-menu-item
+        (click)="toggleIsShowHeaders()"
+        data-testid="settings-headers"
+      >
         <mat-icon>{{
           isShowHeaders ? "check_box" : "check_box_outline_blank"
         }}</mat-icon>
diff --git a/springwolf-ui/src/app/components/header/header.component.spec.ts b/springwolf-ui/src/app/components/header/header.component.spec.ts
index 8ece76d10..a3b4beaf1 100644
--- a/springwolf-ui/src/app/components/header/header.component.spec.ts
+++ b/springwolf-ui/src/app/components/header/header.component.spec.ts
@@ -58,4 +58,36 @@ describe("HeaderComponent", () => {
     fireEvent.click(screen.getByText("group1"));
     expect(mockedUiService.changeGroup).toHaveBeenCalledWith("group1");
   });
+
+  it("should trigger show bindings when clicked in settings menu", () => {
+    uiConfigSubject.next({
+      initialConfig: { showBindings: true, showHeaders: true },
+      groups: [{ name: "group1" }, { name: "group2" }],
+    });
+
+    // when clicking the checkbox
+    const settingButton = screen.getByTestId("settings");
+    fireEvent.click(settingButton);
+    const checkBox = screen.getByTestId("settings-bindings");
+    fireEvent.click(checkBox);
+
+    // then toggleIsShowBindings is called
+    expect(mockedUiService.toggleIsShowBindings).toBeCalled();
+  });
+
+  it("should trigger show headers when clicked in settings menu", () => {
+    uiConfigSubject.next({
+      initialConfig: { showBindings: true, showHeaders: true },
+      groups: [{ name: "group1" }, { name: "group2" }],
+    });
+
+    // when clicking the checkbox
+    const settingButton = screen.getByTestId("settings");
+    fireEvent.click(settingButton);
+    const checkBox = screen.getByTestId("settings-headers");
+    fireEvent.click(checkBox);
+
+    // then toggleIsShowHeaders is called
+    expect(mockedUiService.toggleIsShowHeaders).toBeCalled();
+  });
 });