사용자 지정 UI 테스트 단계

  • 릴리스 버전: Xanadu
  • 업데이트 날짜 2024년 08월 01일
  • 읽기9분
  • HTML 및 JavaScript 페이지 구성요소를 검색하고 지원하는 테스트 작업을 식별하여 UI 페이지 및 UI 매크로와 같은 사용자 지정 사용자 인터페이스를 테스트합니다.

    사용자 지정 UI 테스트 단계에서는 대상 웹 페이지에서 테스트 가능한 구성요소를 검색하고 식별해야 Automated Test Framework 합니다.

    주:
    사용자 지정 UI 테스트 단계는 현재 UI를 지원하지 않습니다.

    테스트 가능한 구성요소

    테스트 가능한 페이지 구성요소는 이러한 특성을 가진 표준 HTML과 JavaScript로 구성됩니다.

    사용자 상호 작용에 의해 설정되거나 클릭됨
    테스트 가능한 페이지 구성요소를 사용하면 사용자가 값을 설정하거나 클릭할 수 있습니다.
    DOM(문서 객체 모델)에서 액세스할 수 있습니다.
    테스트 가능한 페이지 구성 요소는 DOM에서 액세스할 수 있으며 DOM의 JavaScript 조작을 지원합니다. 사용자 지정 UI 테스트 단계에서는 섀도 DOM의 페이지 구성요소에 액세스할 수 없습니다.
    JavaScript에 접근 가능
    테스트 가능한 페이지 구성요소는 JavaScript에서 액세스할 수 있습니다. 사용자 지정 UI 테스트 단계에서는 파일 필드와 같이 운영 체제와 직접 상호 작용하거나 Excel 또는 PDF 파일과 같이 HTML이 아닌 컨텐츠를 표시하는 페이지 구성요소에 액세스할 수 없습니다.
    새 브라우저 탭 또는 창은 사용자 지정 UI 테스트 단계에서 지원되지 않습니다.
    사용자 지정 UI 테스트에서 제외되지 않음
    테스트 가능한 페이지 구성요소는 사용자 지정 UI 테스트에서 제외되지 않습니다. Automated Test Framework 다른 테스트 단계 범주에서 이미 테스트할 수 있는 페이지 구성요소를 제외하고 기능과 연결된 Now Platform 페이지 구성요소도 제외합니다.
    페이지 검사기 액세스할 수 있습니다.
    테스트 가능한 페이지 구성요소는 페이지 검사기에서 볼 때 결과를 반환해야 합니다. 테스트 디자이너는 페이지 검사기 사용하여 페이지의 테스트 가능한 구성 요소를 식별할 수 있습니다.
    테스트 가능한 페이지 구성요소의 예로는 다음 UI 요소가 있습니다.
    • 단추
    • 링크
    • 페이지 텍스트
    • UI 컨트롤
    • UI 매크로
      • ui_date
      • ui_date_time
      • ui_reference
    • UI 페이지
    • 마법사

    테스트할 수 없는 페이지 구성요소의 예로는 다음 UI 요소가 있습니다.

    표 1. 테스트할 수 없는 페이지 구성요소 예
    테스트할 수 없는 이유 테스트할 수 없는 페이지 구성요소
    설정할 수 없거나 클릭할 수 없습니다. 숨겨진 컨트롤
    HTML 주석
    div, section 및 span과 같은 HTML 레이아웃 요소입니다.
    HTML 스크립트 요소
    DOM에서 액세스할 수 없습니다. 대시보드
    이미지
    목록
    보고서
    섀도우 DOM
    JavaScript에 접근할 수 없음 Excel 파일
    파일 필드
    PDF 파일
    기능임 Now Platform 플로우 디자이너
    스튜디오
    모니터 업그레이드
    다른 테스트 단계 범주로 테스트 가능 양식 필드 레이블
    양식 필드 값
    서비스 카탈로그
    작업 공간

    설정 가능한 페이지 구성요소

    설정 가능한 구성요소는 텍스트 입력 필드와 같은 동적 값이 있는 UI 요소입니다. 설정 가능한 구성 요소는 이러한 테스트 작업 및 테스트 단계를 지원합니다.

    표 2. 설정 가능한 구성요소에 대한 테스트 옵션
    페이지 검사기 작업 사용자 지정 UI 테스트 단계
    구성요소 값 설정 구성요소 값 설정(사용자 지정 UI)
    구성요소 값 임포트 페이지에서 텍스트 어설션(사용자 지정 UI)
    구성요소 값 확인(사용자 지정 UI)
    구성요소 사용 안 함 구성요소 상태 확인(사용자 지정 UI)

    설정 가능한 구성 요소에는 사용자 지정 UI 테스트 단계에서 설정할 수 있는 값을 결정하는 데이터 형식 이 있습니다. 예를 들어 특정 기록에 대한 참조를 표시하려는 페이지 구성 요소에는 Sys ID 값만 표시하는 참조 데이터 유형이 있을 수 있습니다.

    Automated Test Framework 를 사용하면 UI 개발자가 사용자 지정 UI 테스트 중에 사용할 데이터 유형을 지정할 수 있습니다. UI 개발자는 페이지 구성요소에 데이터 유형을 할당하여 테스트 단계가 유효한 값을 설정하도록 할 수 있습니다. 이러한 데이터 유형이 지원됩니다.
    • 날짜
    • 날짜 시간
    • 참조

    자세한 내용은 구성요소 데이터 유형 재정의 문서를 참조하십시오.

    클릭할 수 있는 페이지 구성요소

    클릭 가능한 구성요소는 사용자가 클릭하여 상호작용할 수 있는 UI 요소입니다(예: 확인란 또는 라디오 유형의 입력). 클릭할 수 있는 구성요소는 이러한 테스트 작업을 지원합니다.

    표 3. 클릭 가능한 구성요소에 대한 테스트 옵션
    페이지 검사기 작업 사용자 지정 UI 테스트 단계
    구성요소 클릭 구성요소를 클릭(사용자 지정 UI)
    구성요소 값 임포트 페이지에서 텍스트 어설션(사용자 지정 UI)
    구성요소 값 확인(사용자 지정 UI)
    구성요소 사용 안 함 구성요소 상태 확인(사용자 지정 UI)

    클릭할 수 있는 구성요소에는 동적 값이 없으므로 데이터 유형이 없습니다.

    검색된 페이지 구성요소

    Automated Test Framework 에는 테스트하는 각 사용자 지정 UI 페이지에 대해 검색된 페이지 구성요소 목록이 저장됩니다. 사용자 지정 UI 테스트 단계는 구성요소구성요소 값 필드에서 검색된 구성요소 목록을 표시합니다.

    기본적으로 페이지 구성요소 목록은 정적이며 테스트 디자이너가 구성요소 검색을 수동으로 클릭할 때만 업데이트됩니다. 관리자는 사용자 지정 UI 테스트 단계가 실행될 때마다 시스템 속성을 sn_atf.page_data_capture.enabled 활성화하여 페이지 구성요소 목록을 새로 고칠 수 있습니다. 테스트 설계 중에 이 속성을 활성화하면 테스트 디자이너가 항상 최신 페이지 구성요소 목록에 액세스할 수 있습니다. 테스트 설계가 완료된 후 이 속성을 비활성화하면 테스트 단계에서 이전에 검색한 페이지 구성요소 목록을 사용할 수 있으므로 테스트를 더 빠르게 실행할 수 있습니다.

    Now Platform 검색된 페이지 구성요소 목록을 데이터로 처리하며 업데이트 세트 또는 애플리케이션 파일에 포함하지 않습니다. 한 인스턴스에서 다른 인스턴스로 테스트를 전송할 때 테스트 디자이너는 페이지 구성 요소를 수동으로 다시 검색해야 합니다.

    디자인 고려 사항

    사용자 지정 UI 페이지 및 페이지 구성요소를 테스트할 때 다음 디자인 고려 사항을 따르십시오.

    페이지 검사기를 사용하여 테스트 가능한 페이지 구성요소 식별
    페이지 검사기는 사용자 지정 UI 테스트에 사용할 수 있는 페이지 구성 요소를 결정합니다. 페이지 검사기에서 사용할 수 없는 페이지 구성 요소는 사용자 지정 UI 테스트에 사용할 수 없습니다.
    테스트할 사용자 지정 UI로 이동합니다
    기존 테스트 단계를 사용하여 대상 사용자 지정 UI로 이동합니다. 예를 들어, 지식베이스 문서를 테스트하려면 기존 테스트 단계를 사용하여 모듈로 이동하거나 기존 기록을 엽니다. 대부분의 사용자 지정 UI 테스트를 하려면 테스트의 일부로 기존 테스트 단계 범주를 사용해야 합니다.
    구성요소 영역을 사용하여 페이지 구성요소 식별
    구성 요소 영역에서는 또는 <section> 요소와 같은 <div> 구성 요소를 포함하는 HTML 레이아웃 요소에 대해 설명합니다. 이 영역은 테스트 디자이너가 페이지 레이아웃에서 위치를 제공하여 구성 요소를 구별하는 데 도움이 됩니다.
    UI가 아닌 Now Platform 사용자 지정 UI 테스트
    기능의 Automated Test FrameworkNow Platform 사용자 지정 UI 테스트를 방지합니다. 예를 들어 대시보드나 그래픽 디자이너는 테스트할 수 없습니다. 대신 이러한 사용자 인터페이스를 직접 제어할 수 있으므로 사용자 지정 UI 페이지와 요소의 유효성을 검사하는 테스트를 빌드합니다.
    HTML 속성을 사용하여 페이지 구성요소 테스트 속성을 재정의합니다.
    에 특정한 Automated Test FrameworkHTML 속성을 사용하여 특정 페이지 구성 요소의 테스트 속성을 변경합니다. 구성요소 테스트 작업 재정의 문서를 참조하십시오.
    테스트를 다른 인스턴스로 이동할 때 페이지 구성 요소를 다시 검색합니다.
    사용자 지정 UI 테스트 단계는 UI 구성요소를 메타데이터로 저장하지 않습니다. 테스터는 인스턴스 간에 테스트를 이동할 때 페이지 구성 요소를 수동으로 다시 검색해야 합니다.

    사용자 지정 UI 테스트 예제

    검색된 구성요소 목록을 사용하여 사용자 지정 UI 테스트 단계를 설계할 수 있습니다. 예를 들어, 지식베이스 문서의 검토 및 의견을 테스트한다고 가정해 보겠습니다. 지식베이스 문서에는 사용자 지정 UI 단계가 테스트해야 하는 여러 페이지 구성요소가 포함되어 있습니다.

    그림 1. 지식 문서 페이지 예제
    "인스턴스 개발자KB0011110 위한 ServiceNow 보안 코딩 가이드"를 표시하는 페이지
    예를 들어 이러한 페이지 구성 요소에는 사용자 지정 UI 테스트 단계가 필요합니다.
    1. 문서 조회수입니다.
    2. 문서를 유용한 것으로 표시하는 버튼입니다.
    3. 코멘트를 남길 텍스트 영역입니다.
    다음 단계에서는 지식베이스 문서에 대한 사용자 지정 UI 테스트를 보여줍니다. 예제 테스트는 이러한 기존 및 사용자 지정 UI 테스트 단계로 구성됩니다.
    1. 모듈로 이동합니다. 'Knowledge' 애플리케이션의 '게시됨' 모듈로 이동합니다.
    2. 기존 기록을 엽니다. ID가 "Knowledge: KB0011110"인 "Knowledge" 양식을 엽니다.
    3. UI 작업을 클릭합니다. "지식" 양식에서 UI 작업 "문서 보기"를 클릭합니다.
    4. 페이지에서 텍스트 어설션(사용자 지정 UI). 페이지에 'developers' 텍스트가 있음을 어설션합니다.
    5. 구성요소 값 설정(사용자 지정 UI). 페이지의 구성요소를 다음과 같이 설정합니다. 'Textarea <textarea> [article_comments]' = 다른 곳의 기사에 대한 URL이 아닌 실제 기사로 업데이트합니다.
    6. 구성요소를 클릭(사용자 지정 UI). 구성요소인 'Button <button>: Comment'를 클릭합니다.
    7. 페이지에서 텍스트 어설션(사용자 지정 UI). 페이지에 '다른 곳에 있는 기사에 대한 URL이 아닌 실제 기사로 업데이트'라는 텍스트가 있음을 어설션합니다.
    그림 2. 지식베이스 문서 테스트의 테스트 단계 예시
    7개의 테스트 단계가 있는 예제 테스트를 보여주는 스크린샷.

    사용자 지정 UI 구성요소 버전 및 순서

    사용자 지정 UI 테스트 단계에서 구성요소를 선택하면 사용자 지정 UI 버전이 표시될 수 있습니다. 중복되는 구성요소가 여러 개인 경우에는 구성요소의 순서가 표시됩니다.

    중복 구성요소의 순서를 보여주는 이미지

    주:
    • 사용자 지정 UI 버전은 사용자 지정 UI 버전이 서로 다른 구성요소가 두 개 이상 있는 경우에만 표시됩니다.
    • 구성요소 드롭다운 메뉴에 중복된 구성요소가 있는 경우에만 순서가 표시됩니다. 표시된 순서에 따라 구분할 수 있습니다.
    • 서로 다른 버전에서 중복된 구성요소가 여러 개 있는 경우 사용자 지정 UI 버전과 순서가 모두 표시됩니다.

    구성요소 식별 중

    sn-atf-id 속성을 사용하여 구성요소를 식별하는 대체 방법을 구현합니다. 이는 구성 요소의 name 또는 id 속성이 동적이고 테스트가 실행될 때마다 변경되는 경우에 유용합니다. 테스트를 실행할 때 ATF가 구성요소를 식별할 수 있도록 일관된 값으로 sn-atf-id 속성을 추가합니다. 또한 테스트를 빌드할 때 구성요소를 식별할 수 있습니다. 예를 들어 버튼 구성 요소에서
    <button sn-atf-id="consistentValue">Test</button>
    주:
    릴리스부터 Rome sn-atf-id 속성이 있는 페이지에 정확히 하나의 구성요소가 있는 경우 ATF는 해당 구성요소의 다른 속성에 관계없이 해당 구성요소를 찾습니다.

    ATF 구성요소 식별 개선

    페이지 영역 열에 포함된 레이블 경로를 사용하여 구성요소를 식별합니다. 릴리스부터 Romesn_atf.element.use_label_path 속성은 기본적으로 true로 설정되었습니다.

    구성요소에 sn-atf-area 속성이 있는 경우 페이지 영역 열에 sn-atf-area 값이 표시됩니다. sn-atf-area 속성이 없으면 해당 구성요소의 레이블 경로가 페이지 영역 열에 표시됩니다.

    구성요소의 레이블 경로를 보여주는 이미지

    주:
    동일한 이름의 레이블 값이 여러 개 있는 경우 레이블 경로는 올바른 구성요소를 식별하는 데 도움이 됩니다. 구성요소에 sn-atf-area 속성 또는 레이블 경로가 없으면 값이 기본값으로 표시됩니다.

    구성요소의 기본값을 보여주는 이미지

    목록에서 필요한 구성요소를 선택하고 제출을 클릭하면 테스트 단계에 대한 설명도 자세한 내용으로 업데이트됩니다.

    제출된 테스트 단계의 업데이트된 설명을 보여주는 이미지