mirror of
https://github.com/angular/angular
synced 2026-05-24 09:28:37 +00:00
4f256d3b00
Tests validate the current behaviour of the transfer state feature: - Tab can be made visible by enabling in the settings menu - Transfer state component displays keys total and size - Validates the existence of the mock content present in https://github.com/angular/angular/tree/main/devtools/src/app/transfer-state.ts PR Close #62843
71 lines
2.4 KiB
JavaScript
71 lines
2.4 KiB
JavaScript
/**
|
|
* @license
|
|
* Copyright Google LLC All Rights Reserved.
|
|
*
|
|
* Use of this source code is governed by an MIT-style license that can be
|
|
* found in the LICENSE file at https://angular.dev/license
|
|
*/
|
|
|
|
function showTransferState() {
|
|
cy.get('.main-toolbar > .settings > button:last-child').click();
|
|
cy.get(
|
|
'.cdk-overlay-container mat-slide-toggle + span:contains("Enable Transfer State Tab")',
|
|
).click();
|
|
}
|
|
|
|
function goToTransferStateTab() {
|
|
showTransferState();
|
|
cy.get('body').type('{esc}');
|
|
cy.get('a[mat-tab-link]:contains("Transfer State")').click();
|
|
cy.get('ng-transfer-state').should('exist');
|
|
cy.get('ng-transfer-state').should('be.visible');
|
|
}
|
|
|
|
describe('transfer state tab', () => {
|
|
beforeEach(() => {
|
|
cy.visit('/');
|
|
goToTransferStateTab();
|
|
});
|
|
|
|
it('shows summary stats', () => {
|
|
cy.get('.summary-card .stat-label').contains('Keys');
|
|
cy.get('.summary-card .stat-label').contains('Total Size');
|
|
});
|
|
|
|
it('shows table headers', () => {
|
|
cy.get('.transfer-state-table th').contains('Key');
|
|
cy.get('.transfer-state-table th').contains('Type');
|
|
cy.get('.transfer-state-table th').contains('Size');
|
|
cy.get('.transfer-state-table th').contains('Value');
|
|
});
|
|
|
|
it('shows the object row with correct data', () => {
|
|
cy.get('.transfer-state-table tr[mat-row]')
|
|
.first()
|
|
.within(() => {
|
|
cy.get('td').eq(0).find('code').should('have.text', 'obj');
|
|
cy.get('td').eq(1).find('.type-badge').should('have.text', 'object');
|
|
cy.get('td').eq(2).should('have.text', '79 B');
|
|
cy.get('td').eq(3).find('.value-preview').should('contain.text', '"appName": "DevTools"');
|
|
cy.get('td').eq(3).find('.value-preview').should('contain.text', '"appVersion": "0.0.1"');
|
|
cy.get('td')
|
|
.eq(3)
|
|
.find('.value-preview')
|
|
.should('contain.text', '"appDescription": "Angular DevTools"');
|
|
});
|
|
});
|
|
|
|
it('shows the array row with correct data', () => {
|
|
cy.get('.transfer-state-table tr[mat-row]')
|
|
.last()
|
|
.within(() => {
|
|
cy.get('td').eq(0).find('code').should('have.text', 'arr');
|
|
cy.get('td').eq(1).find('.type-badge').should('have.text', 'array');
|
|
cy.get('td').eq(2).should('have.text', '11 B');
|
|
cy.get('td')
|
|
.eq(3)
|
|
.find('.value-preview')
|
|
.should('contain.text', '[\n 1,\n 2,\n 3,\n 4,\n 5\n]');
|
|
});
|
|
});
|
|
});
|