diff --git a/extensions/kafka-client/deployment/src/main/resources/dev-static/js/config.js b/extensions/kafka-client/deployment/src/main/resources/dev-static/js/config.js
index 130b130828fbe..913a6d4f8fc73 100644
--- a/extensions/kafka-client/deployment/src/main/resources/dev-static/js/config.js
+++ b/extensions/kafka-client/deployment/src/main/resources/dev-static/js/config.js
@@ -1,2 +1,5 @@
-export const api = '/q/dev/io.quarkus.quarkus-kafka-client/kafka-admin';
+export const api = () => {
+    let path = window.location.pathname
+    return path.replace('/kafka-dev-ui', '/kafka-admin')
+}
 export const ui = 'kafka-ui';
\ No newline at end of file
diff --git a/extensions/kafka-client/deployment/src/main/resources/dev-static/js/web/web.js b/extensions/kafka-client/deployment/src/main/resources/dev-static/js/web/web.js
index 6ba79b5c19720..c981bf9e24a86 100644
--- a/extensions/kafka-client/deployment/src/main/resources/dev-static/js/web/web.js
+++ b/extensions/kafka-client/deployment/src/main/resources/dev-static/js/web/web.js
@@ -2,7 +2,7 @@ import {api} from "../config.js"
 
 export function doPost(data, successCallback, errorCallback) {
     $.ajax({
-        url: api,
+        url: api(),
         type: 'POST',
         data: JSON.stringify(data),
         contentType: "application/json; charset=utf-8",
diff --git a/integration-tests/devmode/pom.xml b/integration-tests/devmode/pom.xml
index b6ec10f4092e8..6a6c2b5ce8521 100644
--- a/integration-tests/devmode/pom.xml
+++ b/integration-tests/devmode/pom.xml
@@ -34,6 +34,11 @@
             <artifactId>quarkus-grpc-deployment</artifactId>
             <scope>test</scope>
         </dependency>
+        <dependency>
+            <groupId>io.quarkus</groupId>
+            <artifactId>quarkus-kafka-client-deployment</artifactId>
+            <scope>test</scope>
+        </dependency>
         <dependency>
             <groupId>io.quarkus</groupId>
             <artifactId>quarkus-resteasy-reactive-qute-deployment</artifactId>
diff --git a/integration-tests/devmode/src/test/java/io/quarkus/test/devconsole/DevConsoleKafkaSmokeTest.java b/integration-tests/devmode/src/test/java/io/quarkus/test/devconsole/DevConsoleKafkaSmokeTest.java
new file mode 100644
index 0000000000000..bbf82bf28ab1b
--- /dev/null
+++ b/integration-tests/devmode/src/test/java/io/quarkus/test/devconsole/DevConsoleKafkaSmokeTest.java
@@ -0,0 +1,29 @@
+package io.quarkus.test.devconsole;
+
+import org.hamcrest.Matchers;
+import org.jboss.shrinkwrap.api.asset.StringAsset;
+import org.junit.jupiter.api.Test;
+import org.junit.jupiter.api.extension.RegisterExtension;
+
+import io.quarkus.test.QuarkusDevModeTest;
+import io.restassured.RestAssured;
+
+/**
+ * Note that this test cannot be placed under the relevant {@code -deployment} module because then the DEV UI processor would
+ * not be able to locate the template resources correctly.
+ */
+public class DevConsoleKafkaSmokeTest {
+
+    @RegisterExtension
+    static final QuarkusDevModeTest config = new QuarkusDevModeTest()
+            .withApplicationRoot(
+                    (jar) -> jar.addAsResource(new StringAsset("quarkus.http.root-path=testing"), "application.properties"));
+
+    @Test
+    public void testServices() {
+        RestAssured.get("testing/q/dev/io.quarkus.quarkus-kafka-client/kafka-dev-ui")
+                .then()
+                .statusCode(200).body(Matchers.containsString("Kafka Dev UI"));
+    }
+
+}