Protractor en Angular moderno

Protractor llegó al fin de su vida útil. Sus pruebas end-to-end se reescriben en Playwright o Cypress, que no dependen del framework de la página.

Antes · AngularJS

describe('login', function () {
  it('signs in', function () {
    browser.get('/login');
    element(by.model('vm.email')).sendKeys('ana@example.com');
    element(by.model('vm.password')).sendKeys('secret');
    element(by.buttonText('Sign in')).click();
    expect(element(by.binding('vm.user.name')).getText()).toEqual('Ana');
  });
});

Después · Angular

import { test, expect } from '@playwright/test';

test('signs in', async ({ page }) => {
  await page.goto('/login');
  await page.getByLabel('Email').fill('ana@example.com');
  await page.getByLabel('Password').fill('secret');
  await page.getByRole('button', { name: 'Sign in' }).click();
  await expect(page.getByTestId('user-name')).toHaveText('Ana');
});

Qué cambia

by.model, by.binding y by.repeater dependían de los internos de AngularJS; las pruebas nuevas ubican elementos por rol, label, texto o test id.
La espera automática por AngularJS se reemplaza por locators y aserciones que reintentan hasta que el elemento está listo.
Las pruebas son código async/await normal, sin el control flow de Protractor.

Consejo de migración. Reescribe los flujos críticos antes de migrar las pantallas. Como los locators nuevos no dependen del framework, la misma suite corre contra la pantalla AngularJS y contra su reemplazo en Angular, y pasa a ser la red de seguridad de la migración.

Relacionado

¿Planeas una migración o una plataforma de microfrontends?

En una llamada de 20 minutos me cuentas tu situación y te digo cómo la abordaría. Si todavía no vale la pena, también te lo digo.

Escríbeme por LinkedIn