@chat21/chat21-web-widget 5.1.34-rc1 → 5.1.34

package/.github/workflows/docker-community-push-latest.yml

@@ -1,10 +1,10 @@
 name: Docker Image Community latest CI
 
-on:  
-  push:  
+on:	
+  push:	 
     branches: [ master ]
-  pull_request:  
-    branches: [ master ]  
+  pull_request:	
+    branches: [ master ]	
 
 jobs:
   push_to_registry:
@@ -12,22 +12,12 @@ jobs:
     runs-on: ubuntu-latest
 
     steps:
-      - name: Check out the repo
-        uses: actions/checkout@v2
-
-      - name: Set up Docker Buildx
-        uses: docker/setup-buildx-action@v2
-
-      - name: Log in to Docker Hub
-        uses: docker/login-action@v2
-        with:
-          username: ${{ secrets.DOCKERHUB_USERNAME }}
-          password: ${{ secrets.DOCKERHUB_TOKEN }}
-
-      - name: Build and push multiarch Docker image
-        uses: docker/build-push-action@v3
-        with:
-          context: .
-          push: true
-          platforms: linux/amd64,linux/arm64
-          tags: chat21/chat21-web-widget:latest
+    - uses: actions/checkout@v2	     
+      name: Check out the repo
+    - uses: docker/build-push-action@v1
+      with:	    
+        username: ${{ secrets.DOCKERHUB_USERNAME }}
+        password: ${{ secrets.DOCKERHUB_TOKEN }}
+        repository: chat21/chat21-web-widget
+        push: true
+        tags: latest

package/.github/workflows/docker-image-tag-community-tag-push.yml

@@ -3,30 +3,20 @@ name: Publish Docker Community image tags
 on:
   push:
     tags:
-      - '**'  # Trigger su qualsiasi tag
-
+      - '**'           # Push events to every tag including hierarchical tags like
 jobs:
+
   push_to_registry:
     name: Push Docker image to Docker Hub
     runs-on: ubuntu-latest
-
     steps:
-      - name: Check out the repo
-        uses: actions/checkout@v2
-
-      - name: Set up Docker Buildx
-        uses: docker/setup-buildx-action@v2
-
-      - name: Log in to Docker Hub
-        uses: docker/login-action@v2
-        with:
-          username: ${{ secrets.DOCKERHUB_USERNAME }}
-          password: ${{ secrets.DOCKERHUB_TOKEN }}
-
-      - name: Build and push multiarch Docker image
-        uses: docker/build-push-action@v3
-        with:
-          context: .
-          push: true
-          platforms: linux/amd64,linux/arm64
-          tags: chat21/chat21-web-widget:${{ github.ref_name }}
+     - name: Check out the repo
+       uses: actions/checkout@v2
+     - name: Push to Docker Hub
+       uses: docker/build-push-action@v1
+       with:
+        username: ${{ secrets.DOCKERHUB_USERNAME }}
+        password: ${{ secrets.DOCKERHUB_TOKEN }}
+        repository: chat21/chat21-web-widget
+        push: true
+        tag_with_ref: true

package/CHANGELOG.md

@@ -6,122 +6,20 @@
 ### **Copyrigth**: 
 *Tiledesk SRL*
 
+# 5.1.34
+- **bug fixed**: if last message is ulr_preview shows previous message buttons
 
-# 5.1.34-rc1
-- **added**: onPageChangeVisibilityDesktop:'open' and 'onPageChangeVisibilityMobile: 'open' in chatbot-panel.html file
+# 5.1.33
+- **bug fixed**: widget not loaded because blob block loading in lauch.js
 
-# 5.1.33-rc12
-- **bug-fixed**: if last message is ulr_preview shows previous message buttons
-
-# 5.1.33-rc11
-- **changed**: **Stream audio** — updated the streaming/voice-mode footer icon.
-- **added**: **Stream audio** — tooltip on the stream button (i18n key `STREAM_AUDIO`, e.g. “Use voice mode”) via SVG `<title>` and `aria-label`.
-
-# 5.1.33-rc10
-- **bug-fixed**: fixed bug with knowledge base json sources without URLs
-
-# 5.1.33-rc9
-- **changed**: **Conversation footer** — accessibility-focused markup (ARIA roles/labels, live regions, semantic send control), stream-audio layout (wrapper + voice mode: hide attach/emoji while streaming, inline status, stream button + spectrum), optional **Close chat** action when `closeChatInConversation` is enabled; emoji restriction alert uses assertive live region semantics.
-- **bug-fixed**: **`getConversationDetail` Tiledesk fallback** — when `getMyRequests()` rejects, the conversation is treated as archived (`isConversationArchived = true`) and the handler returns immediately instead of resetting state from an empty fallback payload.
-- **bug-fixed**: **`VoiceService`** — skip Web Audio `createMediaStreamSource` when the `MediaStream` has no audio tracks (avoids `InvalidStateError` under mocked `getUserMedia` in unit tests and edge browsers).
-- **bug-fixed**: **`TtsAudioPlaybackCoordinator`** — avoid emitting a duplicate `isTTSPlaying$` `true` when preempting an already-playing owner (keeps emission sequence stable for consumers).
-- **bug-fixed**: **Unit tests** — aligned `BubbleMessageComponent` specs with `calcImageSize` + DI mocks; `AudioSyncComponent` spec module setup (`declarations` + `CommonModule`) and TTS streaming call expectations; `VoiceService` specs with realistic mic streams and updated expectations for proxy `listening` / `barge_in` (no `setAudioMuted` on those paths); `TtsAudioPlaybackCoordinator` `stopAll` test asserts `_stopAll$` broadcast via spy; `ConversationComponent` spec for Tiledesk error path.
-
-# 5.1.33-rc7
-- **added**: added more URL source types in kb_json_sources
-
-# 5.1.33-rc5
-- **added**: cssSource tiledeskSettings property to manage and override widget style 
-
-# 5.1.33-rc4
-- **bug fixed**: bug fixed extractUrlsFromText
-
-# 5.1.32-rc18
-- **bug fixed**: bug fix css kb_json_sources
-
-# 5.1.32-rc17
-- **bug fixed**: empty message in preview URLs
-
-# 5.1.32-rc16
-- **added**: added chat-json-sources to preview URLs
-
-# 5.1.32-rc15
-- **changed**: redemptionMs: 800
-
-# 5.1.32-rc14
-- **changed**: minor ui fixed
-
-# 5.1.32-rc13
-- **added**: VAD speech state events (`speechStart$`, `speechEnd$`) to improve UI/state transitions around user speech
-- **changed**: stream audio footer UI — stream button expands into a “Terminate” pill with animated level bars driven by mic intensity; recorder icon hidden while streaming; textarea width adjusted while streaming
-- **changed**: `StreamAudioSpectrum` — consolidated stream spectrum + stream button visuals into a single component with improved silence vs speaking handling and volume-driven bar heights
-- **changed**: conversation layout while streaming — adjusted received bubble sizing (`fullSizeMessage`) and loading spinner spacing (`fullSize`) for full-width stream mode
-
-
-
-# 5.1.32-rc12
-- **changed**: voice acquisition blocking during TTS response — pause VAD after user speech ends until the TTS response cycle completes; added safety timeout and `isAcquisitionBlocked$` to drive UI (e.g. greyed spectrum)
-- **chore**: version bump to `5.1.32-rc12`
-
-# 5.1.32-rc11
-- **added**: global TTS stop — `TtsAudioPlaybackCoordinator.stopAll()` + `stopAllPlayback$` to abort current and queued TTS playback and reveal full message text
-- **changed**: stop TTS playback when closing stream audio
-- **chore**: version bump to `5.1.32-rc11`
-
-# 5.1.32-rc10
-- **added**: TTS playback state (`isTTSPlaying$`) to coordinate voice UI and suppress mic segment emission while the bot is speaking
-- **changed**: stream spectrum theme color turns grey while TTS is playing
-
-
-# 5.1.32-rc9
-- **added**: mic-triggered TTS interruption — when VAD detects user speech, stop current TTS playback, clear the queue, and reveal the full message text
-- **added**: global TTS stop API (`TtsAudioPlaybackCoordinator.stopAll()` + `stopAllPlayback$`) to stop current + queued TTS playback from UI/events (e.g. close stream)
-- **changed**: `chat-audio-sync` TTS playback now streams audio via authenticated POST to `message.metadata.src`, sending `voiceSettings` + `text` and `streaming: true`
-- **changed**: stream UI spectrum — removed circular orb and stretched the spectrum line to fill the `#streamAudioAlert` width with 10px side padding
-- **changed**: conversation content layout while streaming — adjusted received bubble left margin and loading spinner margins for full-size mode
-
-
-# 5.1.32-rc8
-- **changed**: updated the dev environment defaults to align with the stage setup (remote config URL, API endpoints, logging level, storage prefix, and related settings)
-
-# 5.1.32-rc7
-- **added**: `StreamAudioSpectrum` component for audio visualization in the streaming footer UI
-- **added**: TTS playback coordinator queue — ensures TTS messages play sequentially without interrupting the previous one
-- **changed**: `chat-audio-sync` — updated TTS audio handling to support streaming playback and improved autoplay/animation timing
-- **changed**: iframe loader (`launch.js`, `launch_template.js`) — streamlined loading logic and improved error handling, with fixes for localhost environments
-
-# 5.1.32-rc4
-- **added**: “Close stream” control (`.close-stream-button`) — content and sheet bottom offset in fullscreen using `--chat-footer-stream-button-height` only while the stream is listening (`isStreamAudioActive`); variables in `_variables.scss`.
-- **added**: `VoiceService.discardCurrentRecordingSegment()` — when a message arrives from another sender during streaming, the current WebM segment is discarded (no upload) without stopping mic/VAD; `interruptStreamDueToPeerMessage()` in the footer no longer clears `isStreamAudioActive`.
-- **changed**: `#streamAudioAlert` — band above the footer with a frosted-glass look (`backdrop-filter`, semi-transparent `color-mix`).
-
-# 5.1.32-rc3
-- **changed**: `nginx.conf` (Docker image) — explicit MIME types for `.mjs`, `.wasm`, `.onnx` and `default_type` at `http` level (avoids `text/plain` on ONNX/VAD modules behind containerized deploys).
-- **chore**: removed deprecated Amazon beta/prod deploy scripts from the repository.
-
-# 5.1.32-rc2
-- **bug fixed**: minor streaming icon UI fixed
-- **changed**: Refactor stream audio button UI in the conversation footer (layout / classes).
-
-# 5.1.32-rc1
-- **added**: Voice pipeline — VAD (`@ricky0123/vad-web`) with ONNX Runtime WASM served from `/assets/onnx` (`copy-onnx-wasm`), `VoiceService` with `audioSegment$` (WebM segments) and optional STT/TTS via unified OpenAI provider using `HttpClient`, transcript / error fields on segment payloads.
-- **added**: Stream audio UI in conversation footer — toggle, real-time volume stream and animated waveform (`volume$`); mic session lifecycle wired to upload segments on speech end.
-- **added**: `MessageModel.isJustRecived` — set when ingesting messages (MQTT/Firebase `addCommandMessage` for `command.type === "message"`, and default for non-command messages in `addedMessage` / `addedNew`) to distinguish “new in session” vs history.
-- **added**: `chat-audio-sync` for TTS messages — karaoke-style word sync to audio, full `message` input, typography aligned with text bubbles; skips animation when `isJustRecived === false`; after playback ends sets `message.isJustRecived = false` so replays show full text without re-animating.
-- **bug fixed**: `AnalyserNode.getByteFrequencyData` TypeScript error — `Uint8Array` created from an explicit `ArrayBuffer` for correct DOM typings.
-- **bug fixed**: `isStreamAudioActive` no longer derived from per-frame mic level (`volume > 1`), which caused the stream button / active state to flash continuously while listening.
+# 5.1.31
+- **bug fixed**: bug fix disabled user-typing with human and user-typing with human is not available
 
 # 5.1.30
 - **bug fixed**: startHidden is not working properly
 
-# 5.1.30-rc3
-- **bug fixed**: bug fix user-typing with human is not available
-
-# 5.1.30-rc2
-- **bug fixed**: bug fix disabled user-typing with human
-
-# 5.1.30-rc1
-- **bug fixed**: startHidden is not working properly
+# 5.1.28
+- **bug fixed**: header option menu is deactivated on mobile
 
 # 5.1.28
 - **bug fixed**: fixed Bot/Human conversation detection by correctly classifying bot replies
@@ -133,22 +31,8 @@
 - **changed**: Set the default autoStart value to false
 - **added**: Added the open widget loading spinner
 - **changed**: Load the widget without authentication and display the speech bubble
-
-# 5.1.27-rc3
-- **bug fixed**: fixed Bot/Human conversation detection by correctly classifying bot replies
-
-# 5.1.27-rc2
-- **bug fixed**: centralized fullscreen management on mobile and handled the case of the closed widget that remained fullscreen
-
-# 5.1.27-rc1
-- **added**: closeChatInConversation parameters
-- **added**: close chat button under textarea footer component
-
-# 5.1.26-rc6
 - **changed**: mobile always opens fullscreen and ignores legacy stored size”.
 - **changed**: changed user-typing 
-
-# 5.1.26-rc5
 - **changed**: Hide the resize-widget button when on mobile
 - **added**: added "I'm thinking" when the bot responds
 
@@ -210,11 +94,6 @@
 - **bug-fixed**: check showEmojiFooterButton to enable/disable emojii
 - **bug-fixed**: markdown is fired as an emojii and blocked by isEmojii check fn
 
-# 5.1.7-rc7
-- **bug-fixed**: button new_conversation always appear. added subscription to conversationAdded
-
-# 5.1.7-rc6
-- **added**: Added MAX_ATTACHMENT_ERROR error message when uploading a file larger than 10 MB
 
 # 5.1.7-rc5
 - **bug-fixed**: bug fixed BUTTON STYLES

package/Dockerfile

@@ -1,7 +1,7 @@
 ### STAGE 1: Build ###
 
 # We label our stage as ‘builder’
-FROM --platform=$BUILDPLATFORM node:20.12.2-alpine3.19 as builder
+FROM node:20.12.2-alpine3.19 as builder
 
 COPY package.json package-lock.json ./
 
@@ -15,11 +15,12 @@ COPY . .
 
 ## Build the angular app in production mode and store the artifacts in dist folder
 
-
 RUN npx ng build --configuration="prod" --output-path=dist --base-href=./ --output-hashing=none
 
+
 ### STAGE 2: Setup ###
-FROM --platform=$BUILDPLATFORM nginx:1.14.1-alpine
+
+FROM nginx:1.14.1-alpine
 
 ## Copy our default nginx config
 COPY nginx.conf /etc/nginx/nginx.conf
@@ -32,4 +33,4 @@ COPY --from=builder /ng-app/dist/browser /usr/share/nginx/html
 
 RUN echo "Chat21 Web Widget Started!!"
 
-CMD ["/bin/sh", "-c", "envsubst < /usr/share/nginx/html/widget-config-template.json > /usr/share/nginx/html/widget-config.json && exec nginx -g 'daemon off;'"]
+CMD ["/bin/sh",  "-c",  "envsubst < /usr/share/nginx/html/widget-config-template.json > /usr/share/nginx/html/widget-config.json && exec nginx -g 'daemon off;'"]

package/angular.json

@@ -61,9 +61,7 @@
               "idb",
               "accept-language-parser",
               "file-saver",
-              "dayjs",
-              "onnxruntime-web",
-              "@ricky0123/vad-web"
+              "dayjs"
             ],
             "sourceMap": true,
             "optimization": false,
@@ -162,19 +160,7 @@
               "src/styles.scss"
             ],
             "scripts": [],
-            "codeCoverage": true,
-            "codeCoverageExclude": [
-              "src/chat21-core/providers/firebase/**/*.ts",
-              "src/chat21-core/providers/mqtt/**/*.ts",
-              "src/main.ts",
-              "src/polyfills.ts",
-              "src/zone-flag.ts",
-              "src/models/**/*.ts",
-              "src/chat21-core/models/**/*.ts",
-              "src/chat21-core/providers/native/**/*.ts",
-              "src/chat21-core/providers/logger/customLogger.ts",
-              "src/chat21-core/providers/logger/loggerInstance.ts"
-            ]
+            "codeCoverage": true
           }
         },
         "e2e": {
@@ -196,9 +182,5 @@
           "defaultConfiguration": "development"
         }
       }
-    }
-  },
-  "cli": {
-    "analytics": false
-  }
+    }}
 }

package/docs/changelog/this-branch.md

@@ -45,39 +45,3 @@ Questo branch migliora il feedback in conversazione e rende il comportamento del
 - Il callout non compare quando il widget e' aperto o quando la preview nuovo messaggio e' attiva.
 - La UI della conversazione indica chiaramente se l'ultimo responder e' bot o umano.
 - "Sto pensando..." compare solo nelle conversazioni bot e ha un comportamento prevedibile.
-# This branch: identificazione bot o umano
-
-## Obiettivo
-
-In questo branch e' stata introdotta una logica esplicita per capire, all'apertura della conversazione, se l'ultimo responder lato server e' un **bot** oppure un **umano**.
-
-## Come viene fatta l'identificazione
-
-- La valutazione parte dai messaggi gia' caricati in conversazione.
-- Viene cercato l'**ultimo messaggio ricevuto dal server** (non inviato dal client corrente).
-- Quel messaggio viene classificato con una funzione dedicata (`classifyMessageSenderKind`) che usa piu' segnali:
-  - `attributes.flowAttributes.chatbot_id` (quando presente indica bot)
-  - pattern del mittente (es. `senderId` con prefisso bot, quando applicabile)
-  - informazioni del mittente (`sender_fullname` e metadati associati)
-
-## Regola speciale per messaggi di sistema
-
-Se l'ultimo messaggio utile e' di tipo `system`, viene fatto un controllo aggiuntivo:
-
-- se in `attributes` e' presente un evento con `messagelabel.key = MEMBER_JOINED_GROUP`
-- e rappresenta il passaggio della conversazione a un operatore
-
-allora la conversazione viene forzata a **Umano** anche se altri indizi potrebbero suggerire bot.
-
-## Risultato in UI
-
-- In apertura conversazione viene mostrato un badge con stato:
-  - `Bot`
-  - `Umano`
-- Questo stato viene ricalcolato al variare dei messaggi ricevuti.
-
-## Effetto sui feedback utente
-
-- Il messaggio temporaneo `"sto pensando..."` viene mostrato solo quando la conversazione risulta di tipo **Bot**.
-- Alla ricezione della prima risposta dal server, `"sto pensando..."` viene nascosto **immediatamente**.
-- Non e' previsto alcun tempo minimo di visualizzazione del messaggio.

package/env.sample

@@ -19,6 +19,5 @@ API_URL=CHANGEIT
 API_BASEIMAGE_URL=CHANGEIT
 ENBED_JS=true
 
-# Speech proxy WebSocket base URL (ws:// or wss://).
-# Used by the voice streaming feature; maps to voiceProxyWsBaseUrl in widget-config.json.
-VOICE_PROXY_WS_BASE_URL=CHANGEIT
+
+

package/nginx.conf

@@ -5,38 +5,18 @@ events {
 }
 
 http {
-    include /etc/nginx/mime.types;
-    default_type application/octet-stream;
-
     server {
         listen 80;
         server_name  localhost;
 
         root   /usr/share/nginx/html;
         index  index.html index.htm;
+        include /etc/nginx/mime.types;
 
         gzip on;
         gzip_min_length 1000;
         gzip_proxied expired no-cache no-store private auth;
-        gzip_types text/plain text/css application/json application/javascript application/x-javascript text/xml application/xml application/xml+rss text/javascript application/wasm;
-
-        # ONNX Runtime (.mjs), WASM e modelli VAD: il browser rifiuta moduli ES con Content-Type: text/plain
-        location ~* \.mjs$ {
-            root /usr/share/nginx/html;
-            default_type application/javascript;
-            charset utf-8;
-            add_header Cache-Control "public, max-age=31536000, immutable";
-        }
-        location ~* \.wasm$ {
-            root /usr/share/nginx/html;
-            default_type application/wasm;
-            add_header Cache-Control "public, max-age=31536000, immutable";
-        }
-        location ~* \.onnx$ {
-            root /usr/share/nginx/html;
-            default_type application/octet-stream;
-            add_header Cache-Control "public, max-age=31536000, immutable";
-        }
+        gzip_types text/plain text/css application/json application/javascript application/x-javascript text/xml application/xml application/xml+rss text/javascript;
 
         location / {
             try_files $uri $uri/ /index.html;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@chat21/chat21-web-widget",
   "author": "Tiledesk SRL",
-  "version": "5.1.34-rc1",
+  "version": "5.1.34",
   "license": "MIT",
   "homepage": "https://www.tiledesk.com",
   "repository": {
@@ -10,15 +10,12 @@
   },
   "scripts": {
     "ng": "ng",
-    "copy-onnx-wasm": "mkdir -p src/assets/onnx && cp node_modules/onnxruntime-web/dist/ort-wasm-simd-threaded.mjs node_modules/onnxruntime-web/dist/ort-wasm-simd-threaded.wasm src/assets/onnx/",
     "start": "ng serve",
     "build": "ng build",
     "test": "ng test",
-    "test:e2e": "playwright test",
     "lint": "ng lint",
     "e2e": "ng e2e",
-    "source-map-explorer": "source-map-explorer dist/*.js",
-    "voice-mock": "node mocks/voice-websocket-mock/server.cjs"
+    "source-map-explorer": "source-map-explorer dist/*.js"
   },
   "private": false,
   "dependencies": {
@@ -35,7 +32,6 @@
     "@ctrl/ngx-emoji-mart": "^9.2.0",
     "@ngx-translate/core": "^16.0.4",
     "@ngx-translate/http-loader": "^16.0.1",
-    "@ricky0123/vad-web": "^0.0.30",
     "accept-language-parser": "^1.5.0",
     "bootstrap": "^5.1.3",
     "dayjs": "^1.11.7",
@@ -44,7 +40,6 @@
     "humanize-duration-ts": "^2.1.1",
     "marked": "^16.3.0",
     "ngx-logger": "^5.0.11",
-    "onnxruntime-web": "^1.24.3",
     "replace": "^1.2.2",
     "rxjs": "^7.8.2",
     "source-map-explorer": "^2.5.3",
@@ -57,7 +52,6 @@
     "@angular/cli": "^18.2.19",
     "@angular/compiler-cli": "^18.2.13",
     "@angular/language-service": "^18.2.13",
-    "@playwright/test": "^1.59.1",
     "@types/jasmine": "^3.6.11",
     "@types/jasminewd2": "~2.0.3",
     "@types/marked": "^6.0.0",
@@ -74,7 +68,6 @@
     "protractor": "~7.0.0",
     "ts-node": "~7.0.0",
     "tslint": "~6.1.0",
-    "typescript": "~5.4",
-    "ws": "^8.18.0"
+    "typescript": "~5.4"
   }
 }

package/src/app/app.component.html

@@ -1,5 +1,5 @@
-<!-- tabindex="9999" -->
-<div id="tiledesk-container" [class.active]="g.isShown"> 
+
+<div id="tiledesk-container" [class.active]="g.isShown" tabindex="9999"> 
 
   <div id="chat21-conversations"
     [ngClass]="{ 'swing-in-bottom-fwd' : g.isOpen === true, 'full-screen-mode' : g.fullscreenMode === true, 'c21-align-left' : g.align === 'left', 'c21-align-right' : g.align !== 'left'}"

package/src/app/app.component.scss

@@ -50,18 +50,8 @@ body {
     margin:0px;
 }
 
-/* Keyboard focus ring scoped to the widget host only (WCAG 2.4.7) */
-chat-root *:focus:not(:focus-visible) {
-    outline: none;
-}
-chat-root *:focus-visible {
-    outline: 2px solid var(--c21-focus-ring, #1a73e8);
-    outline-offset: 2px;
-}
-
-::-moz-focus-inner {
-    border: 0;
-}
+:focus {outline: none !important;}
+::-moz-focus-inner {border:0;}
 
 
 
@@ -252,7 +242,10 @@ chat-root {
     height: 100%;
     
     // ========= BEGIN: RESET CSS TAG ========= //
-    button {
+    *:focus {
+        outline: none;
+    }
+    button{
         cursor: pointer;
     }
 
@@ -262,19 +255,14 @@ chat-root {
 
     textarea,
     textarea:visited,
+    textarea:focus,
     textarea:hover,
-    textarea:active {
+    textarea:active{
+        // all: unset;
         line-height: 20px!important;
-        box-shadow: none!important;
-        border: 0px solid var(--trasp-light-black)!important;
-    }
-
-    textarea:focus:not(:focus-visible) {
         outline: none!important;
-    }
-
-    textarea:focus-visible {
-        outline: 0px !important;
+        box-shadow:none!important;
+        border: 0px solid var(--trasp-light-black)!important;
     }
 
     // ========= BEGIN: CSS APP.COMPONENT ========= //
@@ -415,7 +403,7 @@ chat-root {
             }
         }
         button.c21-button-primary:hover,
-        button.c21-button-primary:focus:not(:focus-visible),
+        button.c21-button-primary:focus,
         button.c21-button-primary:active {
             //outline-width: 0px;
             opacity: 0.8;
@@ -431,9 +419,10 @@ chat-root {
             cursor: pointer;
         }
         button.c21-button-link:hover,
-        button.c21-button-link:focus:not(:focus-visible),
+        button.c21-button-link:focus,
         button.c21-button-link:active {
             text-decoration: underline;
+            outline: none;
         }
 
         .c21-divBudge {

package/src/app/app.component.spec.ts

@@ -1,4 +1,3 @@
-import { NO_ERRORS_SCHEMA } from '@angular/core';
 import { Triggerhandler } from './../chat21-core/utils/triggerHandler';
 import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 import { RouterTestingModule } from '@angular/router/testing';
@@ -21,32 +20,25 @@ import { PresenceService } from 'src/chat21-core/providers/abstract/presence.ser
 import { UploadService } from 'src/chat21-core/providers/abstract/upload.service';
 import { AppConfigService } from './providers/app-config.service';
 import { ChatManager } from 'src/chat21-core/providers/chat-manager';
-import { Globals } from './utils/globals';
-
-
+import { NGXLogger } from 'ngx-logger';
 import { CustomLogger } from 'src/chat21-core/providers/logger/customLogger';
 import { LoggerInstance } from 'src/chat21-core/providers/logger/loggerInstance';
 import { provideHttpClient, withInterceptorsFromDi } from '@angular/common/http';
-import { of } from 'rxjs';
  
 describe('AppComponent', () => {
   let component: AppComponent;
   let fixture: ComponentFixture<AppComponent>;
-  const ngxlogger = jasmine.createSpyObj('NGXLogger', ['log', 'trace', 'debug', 'warn', 'error', 'info']);
-  const customLogger = new CustomLogger(ngxlogger);
+  let ngxlogger: NGXLogger;
+  let customLogger = new CustomLogger(ngxlogger)
   
   beforeEach(waitForAsync(() => {
-    LoggerInstance.setInstance(customLogger);
-    spyOn(AppComponent.prototype, 'ngAfterViewInit').and.stub();
     TestBed.configureTestingModule({
     declarations: [
         AppComponent
     ],
     imports: [RouterTestingModule,
         TranslateModule.forRoot()],
-    schemas: [NO_ERRORS_SCHEMA],
     providers: [
-        Globals,
         Triggerhandler,
         GlobalSettingsService,
         AppStorageService,
@@ -71,18 +63,11 @@ describe('AppComponent', () => {
   }));
 
   beforeEach(() => {
-    spyOn(TestBed.inject(GlobalSettingsService), 'getProjectParametersById').and.returnValue(
-      of({ project: null }) as any,
-    );
-    spyOn(TestBed.inject(GlobalSettingsService), 'manageLoadingDomains').and.returnValue(true);
-
-    const translator = TestBed.inject(TranslatorService);
-    spyOn(translator, 'initI18n').and.returnValue(Promise.resolve(undefined));
-    spyOn(translator, 'translate').and.stub();
-    spyOn(translator, 'getLanguage').and.returnValue('en');
-
     fixture = TestBed.createComponent(AppComponent);
     component = fixture.componentInstance;
+    LoggerInstance.setInstance(customLogger)
+    let logger = LoggerInstance.getInstance()
+    component['logger']= logger
     fixture.detectChanges();
   });