diff --git a/frontend/src/ts/input/handlers/keydown.ts b/frontend/src/ts/input/handlers/keydown.ts
index c63b94a503bf..6b070f410f57 100644
--- a/frontend/src/ts/input/handlers/keydown.ts
+++ b/frontend/src/ts/input/handlers/keydown.ts
@@ -79,7 +79,7 @@ export async function handleOppositeShift(event: KeyboardEvent): Promise<void> {
     Config.keymapLayout !== "overrideSync"
   ) {
     let keymapLayout = await __nonReactive
-      .getKeymapLayout()
+      .getInputLayout()
       .catch(() => undefined);
     if (keymapLayout === undefined) {
       showErrorNotification("Failed to load keymap layout");
diff --git a/frontend/src/ts/states/test.ts b/frontend/src/ts/states/test.ts
index 9fbcde920c67..13186f92ebad 100644
--- a/frontend/src/ts/states/test.ts
+++ b/frontend/src/ts/states/test.ts
@@ -124,22 +124,42 @@ keymapEvent.useListener(({ mode, key, correct }) => {
   }
 });
 
-let layoutPromise = promiseWithResolvers();
+let inputLayoutPromise = promiseWithResolvers();
+const getInputLayout = createMemo<{
+  layout: string;
+  isMirrored: boolean;
+}>(() => {
+  return {
+    layout: getConfig.layout === "default" ? "qwerty" : getConfig.layout,
+    isMirrored: getConfig.funbox.includes("layout_mirror"),
+  };
+});
 
-async function waitForLayoutReady(): Promise<void> {
-  await layoutPromise.promise;
-  if (keymapLayoutObject.state === "ready") return;
+const [inputLayoutObject] = createResource(getInputLayout, async (layout) => {
+  const result = await getLayout(layout.layout);
+  if (layout.isMirrored) {
+    return mirrorLayoutKeys(result);
+  }
+  return result;
+});
 
-  if (keymapLayoutObject.state === "errored") {
-    throw new Error("Failed to load keymap layout");
+async function waitForInputLayoutReady(): Promise<void> {
+  await inputLayoutPromise.promise;
+  if (inputLayoutObject.state === "ready") return;
+
+  if (inputLayoutObject.state === "errored") {
+    throw new Error("Failed to load input layout");
   }
 }
 
 createEffect(() => {
-  const state = keymapLayoutObject.state;
-  if (state === "ready" || state === "errored") {
-    layoutPromise.resolve();
-    layoutPromise.reset();
+  const state = inputLayoutObject.state;
+  inputLayoutPromise.reset();
+  if (state === "ready") {
+    inputLayoutPromise.resolve();
+  }
+  if (state === "errored") {
+    inputLayoutPromise.reject(new Error("failed to fetch input layout"));
   }
 });
 
@@ -147,11 +167,11 @@ createEffect(() => {
  * Used for non reactive access. Do not use in Solid components.
  */
 export const __nonReactive = {
-  getKeymapLayout: async (): Promise<LayoutObject> => {
-    await waitForLayoutReady();
-    const result = keymapLayoutObject();
+  getInputLayout: async (): Promise<LayoutObject> => {
+    await waitForInputLayoutReady();
+    const result = inputLayoutObject();
     if (result === undefined) {
-      throw new Error("Failed to load keymap layout");
+      throw new Error("Failed to load input layout");
     }
     return result;
   },
diff --git a/frontend/src/ts/test/layout-emulator.ts b/frontend/src/ts/test/layout-emulator.ts
index 6fadb61d5602..4ed03c45324d 100644
--- a/frontend/src/ts/test/layout-emulator.ts
+++ b/frontend/src/ts/test/layout-emulator.ts
@@ -31,7 +31,7 @@ export async function getCharFromEvent(
 
   let layout;
   try {
-    layout = await __nonReactive.getKeymapLayout();
+    layout = await __nonReactive.getInputLayout();
   } catch (e) {
     showErrorNotification("Failed to emulate event", { error: e });
     return null;