각도기 'await`을 사용하여 element(). getAttribute()를 실행하면 오류가 발생합니다.' 'await'피연산자 유형이 유효한 약속이어야합니다 ... "

Question

각도기를 사용하여 Angular2 앱의 비헤이비어 테스트를 작성하고 있습니다. , 나는 비동기/새로운 구문을 기다리고 있습니다. 이 문제는 나를 멈추게했다. 누군가가 메서드에서 Typescript 오류 Type of 'await' operand must either be a valid promise or must not contain a callable 'then' member.을 얻는 이유와 해결 방법을 설명 할 수 있습니까?

이미지의 너비를 확인하여 이미지가 표시되는지 확인하려고하는 다음과 같은 간단한 각도기 사양이 있습니다.

은 여기 내 E2E-spec.ts 파일에서 발췌 한 것입니다 :

import { LoginPage, Layout } from '../page_objects'; 

describe('Login page',() => { 
    it('Should have the logo in the footer', async() => { 
    await LoginPage.navigateTo(); 
    await expect(Layout.isFooterLogoPresent).toBe(true); 
    }) 
}); 

그리고 여기에 문제의 로고 이미지에 대한 가시성을 가지고 내 레이아웃 페이지 개체에서 미리보기입니다. 오류를 일으키는 await element(...).getAttribute(...) 체인이있는 줄.

static get isFooterLogoPresent() { 
    return element(by.css('.content-footer img')).getAttribute('naturalWidth') // naturalWidth attr is 0 if image is missing 
     .then(imgWidth => imgWidth > 0); 
    } 

을 BTW, 나는 타입 스크립트 2.3.2와 각도기 5.2.0을 사용하고 있습니다 : (작동)

import { browser, element, by } from 'protractor/globals'; 

export class Layout { 
    static get isFooterLogoPresent() { 
    return (async() => { // <-- this wrapping is necessary to use async/await in getter method 
     return await element(by.css('.content-footer img')).getAttribute('naturalWidth') > 0; // <-- PROBLEM HERE 
    }) 
    } 
} 

다음 약속 기반의 구문은 내가 대체하기 위해 노력하고있어입니다. 내가 가지고있는 모든 지혜에 감사드립니다. 감사!

Answer 1

은 그냥 기다리고 있기 괄호를 추가 -

import { browser, element, by } from 'protractor/globals'; 

    export class Layout { 
    static get isFooterLogoPresent() { 
     return (async() => { 
     return (await $('.content-footer img').getAttribute('naturalWidth')) > 0; 
     }) 
    } 
    } 

이 해결 값으로 > 0을 적용하지 비교 표현

를하지만에! 당신은 여기에 오류가 있습니다 isFooterLogoPresent는 여전히

await expect(Layout.isFooterLogoPresent).toBe(true); 

기능은 사실로 약속 개체를 주장 그래서, JS에서 객체 비교가 어떻게 작동하는지에 따라 항상 참이 될 것입니다, 약속을 반환합니다. 내가 각도기 5.2 아직 비동기/await를 구문에 대한 준비가되어 있지 결론에 간다

await expect(await Layout.isFooterLogoPresent).toBe(true); 

Answer 2

이에 변경은 거짓 양성을 해결합니다. 아무도 제대로 작동하지 않는다면, 어떻게 그리고 어떤 버전인지 알고 싶습니다. 현재 소스가 getAttribute() 인 경우개체를 반환하지만 Promise는 반환하지 않습니다. 이 개체는 .then() 메서드를 가지고 있으므로 을 사용하면 .then()을 연결하여 약속 한 결과를 얻을 수 있지만 TypeScript (정당한)는 적절한 약속으로 인식하지 못합니다 (await).

잠시 동안 저는이 각도기 프로젝트에 대해 비동기/기다리고 있습니다. 나는 대신에 약속들로 완전히 비동기적인 행동을 다루는 것에 넘어 가고 있습니다.