Add meaningful tests to 7 component spec files

Previously these test files only had a single "should create" test.
Added tests for:

- db-table-ai-panel: thread creation, messaging, keyboard events, error handling
- widget: initialization, ngOnChanges, output emitters, docs URLs
- sso: SAML config fetching, create/update operations, router navigation
- filter json-editor: code model initialization, editor options, value handling
- record-edit code: language from widget params, theme from UiSettingsService
- record-edit json-editor: JSON stringification, null/undefined handling
- record-edit markdown: markdown language setup, theme configuration

Test count increased from 825 to 883 (+58 tests)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

Author: gugu

frontend/src/app/components/dashboard/db-table-view/db-table-ai-panel/db-table-ai-panel.component.spec.ts

@@ -4,28 +4,166 @@ import { MatIconTestingModule } from '@angular/material/icon/testing';
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 import { Angulartics2Module } from 'angulartics2';
 import { MarkdownService } from 'ngx-markdown';
+import { of, throwError } from 'rxjs';
+import { ConnectionsService } from 'src/app/services/connections.service';
+import { TableStateService } from 'src/app/services/table-state.service';
+import { TablesService } from 'src/app/services/tables.service';
 import { DbTableAiPanelComponent } from './db-table-ai-panel.component';
 
 describe('DbTableAiPanelComponent', () => {
 	let component: DbTableAiPanelComponent;
 	let fixture: ComponentFixture<DbTableAiPanelComponent>;
+	let tablesService: TablesService;
+	let tableStateService: TableStateService;
 
 	const mockMarkdownService = {
 		parse: vi.fn().mockReturnValue('parsed markdown'),
 	};
 
+	const mockConnectionsService = {
+		currentConnectionID: '12345678',
+	};
+
+	const mockTablesService = {
+		currentTableName: 'users',
+		createAIthread: vi.fn(),
+		requestAImessage: vi.fn(),
+	};
+
+	const mockTableStateService = {
+		aiPanelCast: of(false),
+		handleViewAIpanel: vi.fn(),
+	};
+
 	beforeEach(async () => {
 		await TestBed.configureTestingModule({
 			imports: [Angulartics2Module.forRoot(), DbTableAiPanelComponent, BrowserAnimationsModule, MatIconTestingModule],
-			providers: [provideHttpClient(), { provide: MarkdownService, useValue: mockMarkdownService }],
+			providers: [
+				provideHttpClient(),
+				{ provide: MarkdownService, useValue: mockMarkdownService },
+				{ provide: ConnectionsService, useValue: mockConnectionsService },
+				{ provide: TablesService, useValue: mockTablesService },
+				{ provide: TableStateService, useValue: mockTableStateService },
+			],
 		}).compileComponents();
 
 		fixture = TestBed.createComponent(DbTableAiPanelComponent);
 		component = fixture.componentInstance;
+		tablesService = TestBed.inject(TablesService);
+		tableStateService = TestBed.inject(TableStateService);
 		fixture.detectChanges();
 	});
 
 	it('should create', () => {
 		expect(component).toBeTruthy();
 	});
+
+	it('should initialize with connection ID and table name', () => {
+		expect(component.connectionID).toBe('12345678');
+		expect(component.tableName).toBe('users');
+	});
+
+	it('should have default AI request suggestions', () => {
+		expect(component.aiRequestSuggestions.length).toBeGreaterThan(0);
+		expect(component.aiRequestSuggestions).toContain('How many records were created last month?');
+	});
+
+	it('should update character count on keydown', () => {
+		component.message = 'Hello';
+		const event = new KeyboardEvent('keydown', { key: 'a' });
+		component.onKeydown(event);
+		expect(component.charactrsNumber).toBe(6);
+	});
+
+	it('should create thread on Enter key when no thread exists', () => {
+		mockTablesService.createAIthread.mockReturnValue(of({ threadId: 'thread-123', responseMessage: 'AI response' }));
+
+		component.message = 'Test message';
+		component.threadID = null;
+
+		const event = new KeyboardEvent('keydown', { key: 'Enter' });
+		Object.defineProperty(event, 'preventDefault', { value: vi.fn() });
+		component.onKeydown(event);
+
+		expect(mockTablesService.createAIthread).toHaveBeenCalledWith('12345678', 'users', 'Test message');
+	});
+
+	it('should send message on Enter key when thread exists', () => {
+		mockTablesService.requestAImessage.mockReturnValue(of('AI response'));
+
+		component.message = 'Follow up message';
+		component.threadID = 'existing-thread';
+
+		const event = new KeyboardEvent('keydown', { key: 'Enter' });
+		Object.defineProperty(event, 'preventDefault', { value: vi.fn() });
+		component.onKeydown(event);
+
+		expect(mockTablesService.requestAImessage).toHaveBeenCalledWith(
+			'12345678',
+			'users',
+			'existing-thread',
+			'Follow up message',
+		);
+	});
+
+	it('should add user message to chain when creating thread', () => {
+		mockTablesService.createAIthread.mockReturnValue(of({ threadId: 'thread-123', responseMessage: 'AI response' }));
+
+		component.message = 'User question';
+		component.createThread();
+
+		expect(component.messagesChain[0]).toEqual({
+			type: 'user',
+			text: 'User question',
+		});
+	});
+
+	it('should add AI response to chain after thread creation', () => {
+		mockTablesService.createAIthread.mockReturnValue(of({ threadId: 'thread-123', responseMessage: 'AI response' }));
+
+		component.message = 'User question';
+		component.createThread();
+
+		expect(component.threadID).toBe('thread-123');
+		expect(component.messagesChain[1]).toEqual({
+			type: 'ai',
+			text: 'parsed markdown',
+		});
+	});
+
+	it('should handle error when creating thread', () => {
+		mockTablesService.createAIthread.mockReturnValue(throwError(() => 'Error message'));
+
+		component.message = 'User question';
+		component.createThread();
+
+		expect(component.messagesChain[1]).toEqual({
+			type: 'ai-error',
+			text: 'Error message',
+		});
+	});
+
+	it('should use suggested message when provided to createThread', () => {
+		mockTablesService.createAIthread.mockReturnValue(of({ threadId: 'thread-123', responseMessage: 'AI response' }));
+
+		component.createThread('Suggested question');
+
+		expect(component.messagesChain[0].text).toBe('Suggested question');
+	});
+
+	it('should call handleViewAIpanel when closing', () => {
+		component.handleClose();
+		expect(mockTableStateService.handleViewAIpanel).toHaveBeenCalled();
+	});
+
+	it('should clear message after sending', () => {
+		mockTablesService.requestAImessage.mockReturnValue(of('AI response'));
+
+		component.message = 'Test message';
+		component.threadID = 'thread-123';
+		component.sendMessage();
+
+		expect(component.message).toBe('');
+		expect(component.charactrsNumber).toBe(0);
+	});
 });

frontend/src/app/components/dashboard/db-table-view/db-table-widgets/widget/widget.component.spec.ts

@@ -1,40 +1,109 @@
+import { NO_ERRORS_SCHEMA, SimpleChange } from '@angular/core';
 import { ComponentFixture, TestBed } from '@angular/core/testing';
-import { NO_ERRORS_SCHEMA } from '@angular/core';
-
-import { WidgetComponent } from './widget.component';
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
-import { MockCodeEditorComponent } from 'src/app/testing/code-editor.mock';
 import { CodeEditorModule } from '@ngstack/code-editor';
+import { MockCodeEditorComponent } from 'src/app/testing/code-editor.mock';
+import { WidgetComponent } from './widget.component';
 
 describe('WidgetComponent', () => {
-  let component: WidgetComponent;
-  let fixture: ComponentFixture<WidgetComponent>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      imports: [WidgetComponent, BrowserAnimationsModule]
-    })
-    .overrideComponent(WidgetComponent, {
-      remove: { imports: [CodeEditorModule] },
-      add: { imports: [MockCodeEditorComponent], schemas: [NO_ERRORS_SCHEMA] }
-    })
-    .compileComponents();
-
-    fixture = TestBed.createComponent(WidgetComponent);
-    component = fixture.componentInstance;
-
-    component.widget = {
-      field_name: 'password',
-      widget_type: "Password",
-      widget_params: "",
-      name: "User Password",
-      description: ""
-    }
-
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
+	let component: WidgetComponent;
+	let fixture: ComponentFixture<WidgetComponent>;
+
+	const mockWidget = {
+		field_name: 'password',
+		widget_type: 'Password',
+		widget_params: '{"minLength": 8}',
+		name: 'User Password',
+		description: 'Password field',
+	};
+
+	beforeEach(async () => {
+		await TestBed.configureTestingModule({
+			imports: [WidgetComponent, BrowserAnimationsModule],
+		})
+			.overrideComponent(WidgetComponent, {
+				remove: { imports: [CodeEditorModule] },
+				add: { imports: [MockCodeEditorComponent], schemas: [NO_ERRORS_SCHEMA] },
+			})
+			.compileComponents();
+
+		fixture = TestBed.createComponent(WidgetComponent);
+		component = fixture.componentInstance;
+
+		component.widget = { ...mockWidget };
+		component.index = 0;
+		component.fields = ['email', 'username', 'password'];
+		component.widgetTypes = ['Default', 'Password', 'Textarea', 'Code'];
+
+		fixture.detectChanges();
+	});
+
+	it('should create', () => {
+		expect(component).toBeTruthy();
+	});
+
+	it('should initialize mutableWidgetParams on init', () => {
+		expect(component.mutableWidgetParams).toEqual({
+			language: 'json',
+			uri: 'widget-params-0.json',
+			value: '{"minLength": 8}',
+		});
+	});
+
+	it('should have correct code editor options', () => {
+		expect(component.paramsEditorOptions.minimap.enabled).toBe(false);
+		expect(component.paramsEditorOptions.wordWrap).toBe('on');
+		expect(component.paramsEditorOptions.automaticLayout).toBe(true);
+	});
+
+	it('should have documentation URLs for widget types', () => {
+		expect(component.docsUrls.Password).toContain('docs.rocketadmin.com');
+		expect(component.docsUrls.Boolean).toContain('widgets_management#boolean');
+		expect(component.docsUrls.Code).toContain('widgets_management#code');
+	});
+
+	it('should emit onSelectWidgetField when field is selected', () => {
+		const emitSpy = vi.spyOn(component.onSelectWidgetField, 'emit');
+		component.onSelectWidgetField.emit('email');
+		expect(emitSpy).toHaveBeenCalledWith('email');
+	});
+
+	it('should emit onWidgetTypeChange when widget type changes', () => {
+		const emitSpy = vi.spyOn(component.onWidgetTypeChange, 'emit');
+		component.onWidgetTypeChange.emit('Textarea');
+		expect(emitSpy).toHaveBeenCalledWith('Textarea');
+	});
+
+	it('should emit onWidgetDelete when delete is triggered', () => {
+		const emitSpy = vi.spyOn(component.onWidgetDelete, 'emit');
+		component.onWidgetDelete.emit('password');
+		expect(emitSpy).toHaveBeenCalledWith('password');
+	});
+
+	it('should emit onWidgetParamsChange with value and fieldName', () => {
+		const emitSpy = vi.spyOn(component.onWidgetParamsChange, 'emit');
+		component.onWidgetParamsChange.emit({ value: '{"new": "params"}', fieldName: 'password' });
+		expect(emitSpy).toHaveBeenCalledWith({ value: '{"new": "params"}', fieldName: 'password' });
+	});
+
+	it('should update mutableWidgetParams when widgetType changes', () => {
+		const newParams = '{"newParam": true}';
+		component.widget = { ...mockWidget, widget_params: newParams };
+
+		component.ngOnChanges({
+			widgetType: new SimpleChange('Password', 'Textarea', false),
+		});
+
+		expect(component.mutableWidgetParams.value).toBe(newParams);
+	});
+
+	it('should not update mutableWidgetParams when widgetType does not change', () => {
+		const originalValue = component.mutableWidgetParams.value;
+
+		component.ngOnChanges({
+			someOtherProperty: new SimpleChange('old', 'new', false),
+		});
+
+		expect(component.mutableWidgetParams.value).toBe(originalValue);
+	});
 });