huahaofeng
/
aspnetcore
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Add delay before showing Reconnection UI (#24137) 

* Add CSS delay before showing Reconnection UI

* rebuild yet again to try and get past the conflict
This commit is contained in:
SQL-MisterMagoo 2020-08-04 05:14:46 +01:00 committed by GitHub
parent 4ef5e10e6d
commit 1be16fb4c9
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 16 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/Components/Web.JS/dist/Release/blazor.server.js generated vendored
View File

File diff suppressed because one or more lines are too long

2
src/Components/Web.JS/src/Platform/Circuits/DefaultReconnectDisplay.ts
View File

@ -64,6 +64,7 @@ export class DefaultReconnectDisplay implements ReconnectDisplay {
this.document.body.appendChild(this.modal);
}
this.modal.style.display = 'block';
this.modal.classList.add('show');
this.button.style.display = 'none';
this.reloadParagraph.style.display = 'none';
this.message.textContent = 'Attempting to reconnect to the server...';
@ -71,6 +72,7 @@ export class DefaultReconnectDisplay implements ReconnectDisplay {
hide(): void {
this.modal.style.display = 'none';
this.modal.classList.remove('show');
}
failed(): void {

4
src/Components/Web.JS/tests/DefaultReconnectDisplay.test.ts
View File

@ -14,6 +14,7 @@ describe('DefaultReconnectDisplay', () => {
expect(element).toBeDefined();
expect(element!.id).toBe('test-dialog-id');
expect(element!.style.display).toBe('block');
expect(element!.classList).toContain('show');
expect(display.message.textContent).toBe('Attempting to reconnect to the server...');
expect(display.button.style.display).toBe('none');
@ -36,6 +37,7 @@ describe('DefaultReconnectDisplay', () => {
display.hide();
expect(display.modal.style.display).toBe('none');
expect(display.modal.classList).not.toContain('show');
});
it ('updates message on fail', () => {
@ -46,6 +48,7 @@ describe('DefaultReconnectDisplay', () => {
display.failed();
expect(display.modal.style.display).toBe('block');
expect(display.modal.classList).toContain('show');
expect(display.message.innerHTML).toBe('Reconnection failed. Try <a href=\"\">reloading</a> the page if you\'re unable to reconnect.');
expect(display.button.style.display).toBe('block');
});
@ -58,6 +61,7 @@ describe('DefaultReconnectDisplay', () => {
display.rejected();
expect(display.modal.style.display).toBe('block');
expect(display.modal.classList).toContain('show');
expect(display.message.innerHTML).toBe('Could not reconnect to the server. <a href=\"\">Reload</a> the page to restore functionality.');
expect(display.button.style.display).toBe('none');
});

9
src/ProjectTemplates/Web.ProjectTemplates/content/BlazorServerWeb-CSharp/wwwroot/css/site.css
View File

@ -48,3 +48,12 @@ a, .btn-link {
right: 0.75rem;
top: 0.5rem;
}
#components-reconnect-modal.show {
animation: VISIBILITY 500ms linear;
}
@keyframes VISIBILITY {
0%,99% { visibility: hidden; }
100% { visibility: visible; }
}