Skip to content
Snippets Groups Projects
Commit 60fbf392 authored by OZGCloud's avatar OZGCloud
Browse files

Merge branch 'master' of git.ozg-sh.de:mgm/goofy

parents 80f1eee1 95965857
No related branches found
No related tags found
No related merge requests found
mat-spinner {
margin: auto;
}
p {
color: #999;
}
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { MatIcon } from '@angular/material/icon';
import { MatSpinner } from '@angular/material/progress-spinner';
import { createEmptyStateResource, StateResource } from '@goofy-client/tech-shared';
import { createEmptyStateResource } from '@goofy-client/tech-shared';
import { SpinnerComponent } from './spinner.component';
import { Component } from '@angular/core';
@Component({
template: `<goofy-client-spinner [stateResource]="stateResource"></goofy-client-spinner>`,
})
export class TestWrapperComponent {
stateResource: StateResource<any> = createEmptyStateResource();
}
describe('SpinnerComponent', () => {
let component: TestWrapperComponent;
let fixture: ComponentFixture<TestWrapperComponent>;
let component: SpinnerComponent;
let fixture: ComponentFixture<SpinnerComponent>;
const spinnerSelector = '[data-test-class="spinner"]'
beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [
SpinnerComponent,
TestWrapperComponent,
MatIcon,
MatSpinner
]
})
.compileComponents();
],
}).compileComponents();
});
beforeEach(() => {
fixture = TestBed.createComponent(TestWrapperComponent);
fixture = TestBed.createComponent(SpinnerComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
......@@ -58,4 +49,26 @@ describe('SpinnerComponent', () => {
expect(spinner).toBeInstanceOf(HTMLElement);
});
});
describe('loaded spinner', () => {
beforeEach(() => {
component.showWhileLoaded = true;
fixture.detectChanges();
})
it('should NOT be visible if NOT loaded', () => {
const spinner = fixture.nativeElement.querySelector(spinnerSelector);
expect(spinner).not.toBeInstanceOf(HTMLElement);
})
it('should be visible if loaded', () => {
component.stateResource = { ...createEmptyStateResource(), loaded: true };
fixture.detectChanges();
const spinner = fixture.nativeElement.querySelector(spinnerSelector);
expect(spinner).toBeInstanceOf(HTMLElement);
});
});
});
......@@ -6,7 +6,7 @@ import { createEmptyStateResource, StateResource } from '@goofy-client/tech-shar
templateUrl: './spinner.component.html',
styleUrls: ['./spinner.component.scss']
})
export class SpinnerComponent implements OnChanges {
export class SpinnerComponent {
@Input() stateResource: StateResource<any> = createEmptyStateResource();
@Input() diameter: number = 70;
......@@ -14,12 +14,9 @@ export class SpinnerComponent implements OnChanges {
@Input() text: string;
@Input() showWhileLoaded: boolean;
showSpinner: boolean;
ngOnChanges(changes: SimpleChanges) {
if (changes.stateResource) {
if (this.showWhileLoaded) this.showSpinner = this.stateResource.loaded;
else this.showSpinner = this.stateResource.loading;
}
get showSpinner(): boolean {
if (this.showWhileLoaded) return this.stateResource.loaded;
return this.stateResource.loading;
}
}
<ng-container *ngIf="redirectStateResource$ | async as redirectStateResource">
<goofy-client-spinner [stateResource]="redirectStateResource" [showWhileLoaded]="true" text="Vorgang wird weitergeleitet">
<goofy-client-spinner
[stateResource]="redirectStateResource"
[showWhileLoaded]="true"
padding="0"
text="Vorgang wird weitergeleitet">
<form class="form" [formGroup]="formService.form" (submit)="submit()">
<goofy-client-text-editor
......
:host {
width: 100%;
max-width: 320px;
display: block;
}
.form {
display: flex;
flex-direction: column;
position: relative;
max-width: 320px;
width: 100%;
::ng-deep {
mat-form-field {
......@@ -12,16 +15,8 @@
}
}
.spinner {
display: inline-flex;
flex-direction: column;
align-items: center;
.mat-spinner {
margin: 8px;
}
p {
color: #999;
goofy-client-spinner {
::ng-deep .spinner {
text-align: center;
}
}
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment