angular/devtools/cypress/integration/property-update.e2e.js
AleksanderBodurri bf292bdcae test(devtools): revive cypress tests (#61972)
Previously these tests would run automatically when Angular DevTools lived in another repo. These files have continued to live here but have not been running automatically on each PR.

Now, these test files have been revived to run properly with our changes since the repo merge. This is a first step to reviving our e2e testing.

Next steps include writing cypress tests for new features like Injector Graph, Router tree, signals visualizations, etc.

PR Close #61972
2025-07-11 10:33:50 -07:00

39 lines
1.1 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
*/
describe('change of the state should reflect in property update', () => {
beforeEach(() => {
cy.visit('/');
});
it('should update the property value', () => {
// Complete the todo
cy.enterIframe('#sample-app').then((getBody) => {
getBody().find('input[type="checkbox"].toggle').first().click();
});
// Select the todo item
cy.get('.tree-wrapper')
.find('ng-tree-node:contains("app-todo[TooltipDirective]")')
.first()
.click({force: true});
// Expand the todo in the property explorer
cy.get('.explorer-panel:contains("app-todo")')
.find('ng-property-view mat-tree-node:contains("todo")')
.click();
// Verify its value is now completed
cy.contains(
'.explorer-panel:contains("app-todo") ' +
'ng-property-view mat-tree-node:contains("completed") ' +
'ng-property-editor .editor',
'true',
);
});
});