SAP 사용자들의 오픈 커뮤니티

• 목록

Week 4 - Unit 4. OPA 테스트 통합

목차

1. 새 OPA 테스트 추가하기
    
2. 새 OPA 페이지 오브젝트 추가하기

1.새 OPA 테스트 추가하기

이제 Worklist에 자체 OPA 테스트를 추가하겠습니다. 제품 목록에서 헤더 툴바의 검색 필드 옆에 'plus' 버튼을 보았을 것입니다. 이 버튼이 뷰를 추가하는지 확인하기 위해 간단한 OPA 테스트를 작성해보겠습니다.

webapp/test/integration/pages/Worklist.js

…
var sViewName = "Worklist",
	sTableId = "table",
	sAddButtonId = "addButton",
	sSearchFieldId = "searchField",
	sSomethingThatCannotBeFound = "*#-Q@@||",
…

먼저 변수 선언에 추가 버튼 ID를 추가합니다. 이 ID는 'Worklist.view.xml' 파일에서 찾을 수 있습니다.

webapp/test/integration/pages/Worklist.js

sap.ui.define([
		"sap/ui/test/Opa5",
		"sap/ui/test/actions/Press",
		"sap/ui/test/actions/EnterText",
		"sap/ui/test/matchers/AggregationLengthEquals",
		"sap/ui/test/matchers/AggregationFilled",
		"sap/ui/test/matchers/PropertyStrictEquals",
		"opensap/manageproducts/test/integration/pages/Common",
		"opensap/manageproducts/test/integration/pages/shareOptions"
	], function(Opa5, Press, EnterText, AggregationLengthEquals, AggregationFilled, PropertyStrictEquals, Common, shareOptions) {

…
Opa5.createPageObjects({

	onTheWorklistPage : {
		baseClass : Common,
		actions :
			…
			iSearchForSomethingWithNoResults : function () {
				return this.iSearchForValue([new EnterText({text: sSomethingThatCannotBeFound}), new Press()]);
			},

			iPressAdd : function () {
				return this.waitFor({
					id: sAddButtonId,
					viewName : sViewName,
					actions : new Press(),
					errorMessage : "Add button not found"
				});
			},
…

이제 Worklist 페이지의 'actions' 섹션에 iPressAdd 기능을 추가할 수 있습니다. 이 함수는 'worklist' 뷰 내에서 id가 'addButton'인 컨트롤을 확인하는 waitFor 문으로 구성됩니다. 버튼을 찾으면 waitFor는 'add' 버튼에 대한 Press 작업을 실행합니다.

누르기는 동작은 'tap' 이벤트를 트리거할 뿐만 아니라 버튼이 포커스를 받는지 확인합니다. 버튼이 표시되지 않으면 Press 작업이 오류를 기록합니다.

2.새 OPA 페이지 오브젝트 추가하기

webapp/test/integration/pages/NewProduct.js (NEW)

sap.ui.require([
		"sap/ui/test/Opa5",
		"opensap/manageproducts/test/integration/pages/Common"
	], function(Opa5, Common) {
		"use strict";

		var sViewName = "Add",
			sPageId = "page";


		Opa5.createPageObjects({
			onTheNewProductPage : {
				baseClass : Common,

				assertions : {
					iShouldSeeThePage : function () {
						return this.waitFor({
							id : sPageId,
							viewName : sViewName,
							success: function () {
								Opa5.assert.ok(true, "The 'New Product' title is shown.");
							},
							errorMessage : "Did not display the 'New Product' page."
						});
					}
				}
			}
		});
	}
);

이제 새 제품에 대한 새 페이지 개체를 추가할 수 있습니다. OPA는 페이지 개체를 사용해 구성합니다. 일반적으로 각 페이지 개체에는 하나의 뷰에서 제어를 위한 작업이 포함됩니다. 이 경우 뷰 추가가 됩니다.

'페이지'가 표시되는지 여부를 확인하는 iShouldSeeThePage를 구현하겠습니다. 이 경우 QUnit assert.ok를 실행하는 함수가 호출됩니다. 그렇지 않은 경우 오류 메시지가 표시되고 테스트가 실패합니다.

webapp/test/integration/AllJourneys.js

…
sap.ui.require([
		"sap/ui/test/Opa5",
		"opensap/manageproducts/test/integration/pages/Common",
		"sap/ui/test/opaQunit",
		"opensap/manageproducts/test/integration/pages/NewProduct",
		"opensap/manageproducts/test/integration/pages/Worklist",
	…
	], 
…

새 페이지가 로드되었는지 확인하려면 'AllJourneys.js'에서 다음을 필요로 합니다.

webapp/test/integration/ObjectJourney.js

sap.ui.define([
		"sap/ui/test/opaQunit"
	], function (opaTest) {
		"use strict";

		QUnit.module("Object");

		…

		opaTest("Should see the 'New Product' view after pressing the 'Add' button", function (Given, When, Then) {
			// Arrangements
			Given.iStartMyApp();
			//Actions
			When.onTheWorklistPage.iWaitUntilTheTableIsLoaded().and.iPressAdd();
			//Assertions
			Then.onTheNewProductPage.iShouldSeeThePage().and.iTeardownMyAppFrame();
		});
	}
);

이제 OPA 테스트를 작성할 준비가 되었습니다. 'ObjectJourney'에 추가해 보겠습니다. journey는 앱 탐색과 같은 동일하게 일련의 통합 테스트로 구성됩니다. QUnit 테스트 구현과 유사하게 OPA5는 QUnit을 사용하므로 먼저 결과 페이지에 표시될 QUnit 모듈 'Object'를 설정합니다.

함수 opaTest는 OPA와의 통합 테스트를 정의하기 위한 중요한 부분입니다. 매개변수는 테스트 이름과 사용자 스토리처럼 읽는 의미 있는 테스트를 작성하기 위해 다음 OPA5 헬퍼 개체와 함께 실행되는 콜백 함수를 정의합니다.

• Given: 주어진 객체에서 iStartMyApp과 같은 배열 함수를 호출하여 통합 테스트를 위해 별도의 iFrame에 앱을 로드할 수 있습니다.

• When: 예상되는 동작을 테스트할 수 있는 상태에서 응용 프로그램을 가져오기 위해 실행할 수 있는 사용자 지정 작업을 포함합니다.

• then: 애플리케이션의 특정 배열을 확인하는 사용자 정의 주장과 iFrame을 다시 제거하는 기능이 포함되어 있습니다.

테스트에서는 먼저 앱을 시작하고 작업 목록 페이지에 테이블이 채워질 때까지 기다립니다. 이후에는 worklist 페이지에서 'add' 버튼을 누릅니다. 다음으로 새 제품 페이지가 표시되는지 확인합니다. 마지막으로 테스트 페이지에서 iFrame을 다시 제거합니다.

새 OPA 테스트를 실행해 보겠습니다. SAP Web IDE 프로젝트의 test/integration 폴더에서 'opaTest.qunit.html' 파일을 선택하고 실행하거나 '실행' 메뉴에서 'OPA 테스트 실행' 실행 구성을 선택합니다. OPA 테스트의 결과는 위 화면과 같아야 합니다.