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: [[]],