var viewportSize = {
	width: 640,
	height: 480,
}
browser.setViewportSize(viewportSize)


describe('AR.js Rendering', function() {
	
	it(`rendering-three.js-artookit-${viewportSize.width}x${viewportSize.height}`, function () {
		var pageURL = '/three.js/examples/test-runner.html?artoolkit'                
		browser.url(pageURL)
		// take a screenshot
		var report = browser.checkViewport()
		console.assert( report[0].isWithinMisMatchTolerance )
	})

	
	it(`rendering-three.js-aruco-${viewportSize.width}x${viewportSize.height}`, function () {
		var pageURL = '/three.js/examples/test-runner.html?aruco'                
		browser.url(pageURL)
		// take a screenshot
		var report = browser.checkViewport()
		console.assert( report[0].isWithinMisMatchTolerance )
	})
	
	// test that clicking in the middle of the screen, actually move the object
	// - aka hit testing should be there
	it('test hit testing', function () {
		var pageURL = '/three.js/examples/test-runner.html?artoolkit'                
		browser.url(pageURL)
		// click to trigger hit-testing
		triggerClick(browser, 0.5, 0.5)

		// take a screenshot
		var report = browser.checkViewport()
		console.assert( report[0].isWithinMisMatchTolerance )
	})
	

	// var windowSize = browser.windowHandleSize();
	// console.log('window.size', windowSize.value.width+'x'+windowSize.value.height); // outputs: { width: 500, height: 602 }
	
			
})


//////////////////////////////////////////////////////////////////////////////
//		Code Separator
//////////////////////////////////////////////////////////////////////////////

// NOTE: should i be custom command http://webdriver.io/guide/usage/customcommands.html

/**
 * client at a given position on the canvas
 * - useful to test hit testing
 */
function triggerClick(browser, normalizedX, normalizedY){
	browser.execute(function(normalizedX, normalizedY) {
		// Create mouse events
		// - https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/MouseEvent
		var mouseEvent = new MouseEvent("click", {
			clientX: normalizedX * arSession.arSource.domElementWidth(),
			clientY: normalizedY * arSession.arSource.domElementHeight(),
		})
		// dispatch the event
		renderer.domElement.dispatchEvent(mouseEvent);
	}, normalizedX, normalizedY)	
}

/**
 * to change currentTime in the testing video
 */
function seekVideo(browser, currentTime){
	browser.execute(function(currentTime) {
		// get the video at a given point
		var videoElement = arSession.arSource.domElement
		videoElement.pause()
		videoElement.currentTime = 4.0
	}, currentTime)	
}