diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cephfs/cephfs-form/cephfs-form.component.html b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cephfs/cephfs-form/cephfs-form.component.html index c05bee1d0ae..76e51b2c5f3 100644 --- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cephfs/cephfs-form/cephfs-form.component.html +++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cephfs/cephfs-form/cephfs-form.component.html @@ -35,7 +35,7 @@ i18n>This field is required! File System name can only contain letters, numbers, '.', '-' or '_' + i18n>File System name should start with a letter and can only contain letters, numbers, '.', '-' or '_' diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cephfs/cephfs-form/cephfs-form.component.spec.ts b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cephfs/cephfs-form/cephfs-form.component.spec.ts index cf85a2128d7..5409131d97b 100644 --- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cephfs/cephfs-form/cephfs-form.component.spec.ts +++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cephfs/cephfs-form/cephfs-form.component.spec.ts @@ -1,15 +1,17 @@ import { HttpClientTestingModule } from '@angular/common/http/testing'; -import { ComponentFixture, TestBed } from '@angular/core/testing'; +import { ComponentFixture, TestBed, fakeAsync, tick } from '@angular/core/testing'; import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; import { RouterTestingModule } from '@angular/router/testing'; import { CephfsVolumeFormComponent } from './cephfs-form.component'; -import { configureTestBed } from '~/testing/unit-test-helper'; +import { FormHelper, configureTestBed } from '~/testing/unit-test-helper'; import { SharedModule } from '~/app/shared/shared.module'; import { ToastrModule } from 'ngx-toastr'; import { ReactiveFormsModule } from '@angular/forms'; describe('CephfsVolumeFormComponent', () => { let component: CephfsVolumeFormComponent; let fixture: ComponentFixture; + let formHelper: FormHelper; + configureTestBed({ imports: [ BrowserAnimationsModule, @@ -24,9 +26,28 @@ describe('CephfsVolumeFormComponent', () => { beforeEach(() => { fixture = TestBed.createComponent(CephfsVolumeFormComponent); component = fixture.componentInstance; + formHelper = new FormHelper(component.form); fixture.detectChanges(); }); + it('should create', () => { expect(component).toBeTruthy(); }); + + it('should validate proper names', fakeAsync(() => { + const validNames = ['test', 'test1234', 'test_1234', 'test-1234', 'test.1234', 'test12test']; + const invalidNames = ['1234', 'test@', 'test)']; + + for (const validName of validNames) { + formHelper.setValue('name', validName, true); + tick(); + formHelper.expectValid('name'); + } + + for (const invalidName of invalidNames) { + formHelper.setValue('name', invalidName, true); + tick(); + formHelper.expectError('name', 'pattern'); + } + })); }); diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cephfs/cephfs-form/cephfs-form.component.ts b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cephfs/cephfs-form/cephfs-form.component.ts index 82f3c4684dd..6d84e33c7b6 100644 --- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cephfs/cephfs-form/cephfs-form.component.ts +++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cephfs/cephfs-form/cephfs-form.component.ts @@ -82,7 +82,7 @@ export class CephfsVolumeFormComponent extends CdForm implements OnInit { }); this.form = this.formBuilder.group({ name: new FormControl('', { - validators: [Validators.pattern(/^[.A-Za-z0-9_-]+$/), Validators.required] + validators: [Validators.pattern(/^[a-zA-Z][.A-Za-z0-9_-]+$/), Validators.required] }), placement: ['hosts'], hosts: [[]],