diff --git a/packages/data-table-view/src/demo.js b/packages/data-table-view/src/demo.js
index 7694ee33b37b9f3dce85ed1d9266af5bde24ea02..e16e6cba70dc0043d93abd521b853fbead2cb914 100644
--- a/packages/data-table-view/src/demo.js
+++ b/packages/data-table-view/src/demo.js
@@ -10,11 +10,13 @@ class DataTableViewDemo extends LitElement {
     constructor() {
         super();
         this.lang = 'de';
+        this.noAuth = false;
     }
 
     static get properties() {
         return {
             lang: { type: String },
+            noAuth: { type: Boolean, attribute: 'no-auth' },
         };
     }
 
@@ -94,6 +96,14 @@ class DataTableViewDemo extends LitElement {
         }
     }
 
+    getAuthComponentHtml() {
+        return this.noAuth ? html`` : html`
+            <div class="content">
+                <vpu-auth lang="${this.lang}" client-id="${setting('keyCloakClientId')}" load-person force-login></vpu-auth>
+            </div>
+        `;
+    }
+
     render() {
         commonUtils.initAssetBaseURL('vpu-data-table-view-src');
         const bulmaCSS = commonUtils.getAssetURL(bulmaCSSPath);
@@ -111,9 +121,7 @@ class DataTableViewDemo extends LitElement {
                 <div class="content">
                     <h1 class="title">DataTableView-Demo</h1>
                 </div>
-                <div class="content">
-                    <vpu-auth lang="${this.lang}" client-id="${setting('keyCloakClientId')}" load-person force-login></vpu-auth>
-                </div>
+                ${this.getAuthComponentHtml()}
                 <div class="content">
                     <h4>DataTable: with data, paging and searching</h4>
                      <div class="box">