[ACS-3886] Fix edit button being disabled when opening edit rule dialog initially (#2754)

* [ACS-3886] Fix edit button being disabled when opening edit rule dialog initially

* Fix test
This commit is contained in:
Thomas Hunter 2022-11-02 09:35:52 +00:00 committed by GitHub
parent 423ab7e2d2
commit 2b12fa983c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 19 additions and 5 deletions

View File

@ -25,11 +25,11 @@
export interface RuleAction {
actionDefinitionId: string;
params: { [key: string]: unknown };
params?: { [key: string]: unknown };
}
export const isRuleAction = (obj): obj is RuleAction =>
typeof obj === 'object' && typeof obj.actionDefinitionId === 'string' && typeof obj.params === 'object';
typeof obj === 'object' && typeof obj.actionDefinitionId === 'string' && (obj.params === undefined || typeof obj.params === 'object');
export const isRuleActions = (obj): obj is RuleAction[] =>
typeof obj === 'object' && obj instanceof Array && obj.reduce((acc, curr) => acc && isRuleAction(curr), true);

View File

@ -21,7 +21,7 @@
[aspects]="aspects$ | async"
[value]="model"
(formValueChanged)="formValue = $event"
(formValidationChanged)="formValid = $event">
(formValidationChanged)="onFormValidChange($event)">
</aca-rule-details>
</ng-template>
</mat-dialog-content>

View File

@ -35,8 +35,9 @@ import { RuleActionListUiComponent } from './actions/rule-action-list.ui-compone
import { RuleActionUiComponent } from './actions/rule-action.ui-component';
import { ActionsService } from '../services/actions.service';
import { RuleOptionsUiComponent } from './options/rule-options.ui-component';
import { timer } from 'rxjs';
describe('EditRuleDialogComponent', () => {
describe('EditRuleDialogSmartComponent', () => {
let fixture: ComponentFixture<EditRuleDialogSmartComponent>;
let actionsService: ActionsService;
@ -65,6 +66,7 @@ describe('EditRuleDialogComponent', () => {
actionsService = TestBed.inject(ActionsService);
spyOn(actionsService, 'loadActionDefinitions').and.stub();
spyOn(actionsService, 'loadAspects').and.stub();
fixture = TestBed.createComponent(EditRuleDialogSmartComponent);
fixture.detectChanges();
@ -75,15 +77,20 @@ describe('EditRuleDialogComponent', () => {
setupBeforeEach();
});
it('should activate the submit button only when a valid state is received', () => {
it('should activate the submit button only when a valid state is received', async () => {
const submitButton = fixture.debugElement.query(By.css('[data-automation-id="edit-rule-dialog-submit"]')).nativeElement as HTMLButtonElement;
const ruleDetails = fixture.debugElement.query(By.directive(RuleDetailsUiComponent)).componentInstance as RuleDetailsUiComponent;
ruleDetails.formValidationChanged.emit(true);
fixture.detectChanges();
// timer needed to wait for the next tick to avoid ExpressionChangedAfterItHasBeenCheckedError
await timer(1).toPromise();
fixture.detectChanges();
expect(submitButton.disabled).toBeFalsy();
ruleDetails.formValidationChanged.emit(false);
fixture.detectChanges();
await timer(1).toPromise();
fixture.detectChanges();
expect(submitButton.disabled).toBeTruthy();
});

View File

@ -72,4 +72,11 @@ export class EditRuleDialogSmartComponent implements OnInit {
this.actionsService.loadAspects();
this.actionsService.loadActionDefinitions();
}
onFormValidChange(isValid: boolean) {
// setTimeout needed to avoid ExpressionChangedAfterItHasBeenCheckedError
setTimeout(() => {
this.formValid = isValid;
}, 0);
}
}