Question

我有一个角度应用程序，我需要在这个项目中实现e2e测试。

angular pack: 4.6.6
protractor: 5.3.0

我的项目中还有一个多层路由器，它将路由器插座包装在每层的另一个组件中。

当我需要在测试环境中导航到其中一个低层路由（例如/notification/groups）时，程序无法从页面获取响应并返回错误：

Failed: Timed out waiting for asynchronous Angular tasks to finish after 11 seconds.
This may be because the current page is not an Angular application. Please see the FAQ for more details: https://github.com/angular/protractor/blob/master/docs/timeouts.md#waiting-for-angular

此外，当我在测试环境中导航到登录页面时，它将通过而没有任何问题，因为它位于路由器的最高层。

所以问题在于角度无法检测到包含在路由器插座中的其他组件的组件。

我如何解决这个问题

这是我的路由器配置：

[
{
        path: "",
        component: ThemeComponent,
        canActivate: [AuthGuard],
        children: [
            {
                path: "",
                component: DefaultComponent,
                children: [
                    {
                        path: "modbus-devices",
                        component: DeviceListComponent,
                        data: { deviceType: 'modbus' }
                    },
                    {
                        path: "snmp-devices",
                        component: DeviceListComponent,
                        data: { deviceType: 'snmp' }
                    },
                    {
                        path: "add-modbus-device",
                        component: ModbusAddDeviceComponent
                    },
                    {
                        path: "edit-modbus-device/:id",
                        component: ModbusEditDeviceComponent
                    },
                    {
                        path: "add-snmp-device",
                        component: SnmpAddDeviceComponent
                    },
                    {
                        path: "edit-snmp-device/:id",
                        component: SnmpEditDeviceComponent
                    },
                    {
                        path: "notification/groups",
                        component: NotificationGroupListComponent
                    },
                    {
                        path: "notification/setting",
                        component: NotificationPrioritySettingComponent
                    },
                    {
                        path: "notification/groups/add",
                        component: NotificationGroupAddComponent,
                        data: { edit: false }
                    },
                    {
                        path: "notification/groups/edit/:id",
                        component: NotificationGroupAddComponent,
                        data: { edit: true }
                    }
                ]
            }
        ],
    }, {
        path: 'login',
        component: AuthComponent
    },
    {
        path: 'logout',
        component: LogoutComponent
    }
]

Answer 1

您收到的错误：

失败：等待异步Angular任务完成超时 11秒后这可能是因为当前页面不是角度应用。请参阅常见问题解答了解更多详情： https://github.com/angular/protractor/blob/master/docs/timeouts.md#waiting-for-angular

...之所以发生，是因为你在Angular区域内运行了长寿命的异步代码。

例如，如果您尝试对其运行e2e测试，则此行代码将导致上述错误：

export class MyComponent implements OnInit {
    ngOnInit() {
        // Do something in a while
        setTimeout(() => {}, 1000000);
    }
}

要修复上述代码的错误，您需要在Angular之外运行setTimeout，这样它就不会使所有代码都挂起。

export class MyComponent implements OnInit {
    constructor(private zone: NgZone) {}

    ngOnInit() {
        this.zone.runOutsideAngular(() => {
            // Do something in a while
            setTimeout(() => {}, 1000000);
        });
    }
}

许多人确定您使用的第三方库的代码或代码没有任何长期存在的异步代码，如果他们这样做，那么您应该在Angular之外运行它们，并且您的问题应该消失。如果您不在Angular之外运行它们，Angular将等待它们完成，如果它达到超时（在这种情况下为11秒），它将为您提供您收到的错误。

e2e量角器测试无法检测多层角度路由器中的角度分量

1 个答案: