| 
									
										
										
										
											2020-08-04 06:23:53 +08:00
										 |  |  | /** | 
					
						
							|  |  |  |  * Copyright 2018 Google Inc. All rights reserved. | 
					
						
							|  |  |  |  * Modifications copyright (c) Microsoft Corporation. | 
					
						
							|  |  |  |  * | 
					
						
							|  |  |  |  * Licensed under the Apache License, Version 2.0 (the "License"); | 
					
						
							|  |  |  |  * you may not use this file except in compliance with the License. | 
					
						
							|  |  |  |  * You may obtain a copy of the License at | 
					
						
							|  |  |  |  * | 
					
						
							|  |  |  |  *     http://www.apache.org/licenses/LICENSE-2.0
 | 
					
						
							|  |  |  |  * | 
					
						
							|  |  |  |  * Unless required by applicable law or agreed to in writing, software | 
					
						
							|  |  |  |  * distributed under the License is distributed on an "AS IS" BASIS, | 
					
						
							|  |  |  |  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. | 
					
						
							|  |  |  |  * See the License for the specific language governing permissions and | 
					
						
							|  |  |  |  * limitations under the License. | 
					
						
							|  |  |  |  */ | 
					
						
							| 
									
										
										
										
											2020-08-20 12:32:12 +08:00
										 |  |  | 
 | 
					
						
							| 
									
										
										
										
											2021-05-06 22:08:22 +08:00
										 |  |  | import { test as it, expect } from './pageTest'; | 
					
						
							| 
									
										
										
										
											2020-08-04 06:23:53 +08:00
										 |  |  | 
 | 
					
						
							| 
									
										
										
										
											2021-09-28 00:58:08 +08:00
										 |  |  | it('should query existing element', async ({ page, server }) => { | 
					
						
							| 
									
										
										
										
											2020-08-04 06:23:53 +08:00
										 |  |  |   await page.goto(server.PREFIX + '/playground.html'); | 
					
						
							|  |  |  |   await page.setContent('<html><body><div class="second"><div class="inner">A</div></div></body></html>'); | 
					
						
							|  |  |  |   const html = await page.$('html'); | 
					
						
							|  |  |  |   const second = await html.$('.second'); | 
					
						
							|  |  |  |   const inner = await second.$('.inner'); | 
					
						
							|  |  |  |   const content = await page.evaluate(e => e.textContent, inner); | 
					
						
							|  |  |  |   expect(content).toBe('A'); | 
					
						
							|  |  |  | }); | 
					
						
							|  |  |  | 
 | 
					
						
							| 
									
										
										
										
											2021-09-28 00:58:08 +08:00
										 |  |  | it('should return null for non-existing element', async ({ page, server }) => { | 
					
						
							| 
									
										
										
										
											2020-08-04 06:23:53 +08:00
										 |  |  |   await page.setContent('<html><body><div class="second"><div class="inner">B</div></div></body></html>'); | 
					
						
							|  |  |  |   const html = await page.$('html'); | 
					
						
							|  |  |  |   const second = await html.$('.third'); | 
					
						
							|  |  |  |   expect(second).toBe(null); | 
					
						
							|  |  |  | }); | 
					
						
							|  |  |  | 
 | 
					
						
							| 
									
										
										
										
											2022-07-28 21:41:32 +08:00
										 |  |  | it('should work for adopted elements', async ({ page, server }) => { | 
					
						
							| 
									
										
										
										
											2020-08-04 06:23:53 +08:00
										 |  |  |   await page.goto(server.EMPTY_PAGE); | 
					
						
							|  |  |  |   const [popup] = await Promise.all([ | 
					
						
							|  |  |  |     page.waitForEvent('popup'), | 
					
						
							| 
									
										
										
										
											2020-08-28 19:20:29 +08:00
										 |  |  |     page.evaluate(url => window['__popup'] = window.open(url), server.EMPTY_PAGE), | 
					
						
							| 
									
										
										
										
											2020-08-04 06:23:53 +08:00
										 |  |  |   ]); | 
					
						
							|  |  |  |   const divHandle = await page.evaluateHandle(() => { | 
					
						
							|  |  |  |     const div = document.createElement('div'); | 
					
						
							|  |  |  |     document.body.appendChild(div); | 
					
						
							|  |  |  |     const span = document.createElement('span'); | 
					
						
							|  |  |  |     span.textContent = 'hello'; | 
					
						
							|  |  |  |     div.appendChild(span); | 
					
						
							|  |  |  |     return div; | 
					
						
							|  |  |  |   }); | 
					
						
							|  |  |  |   expect(await divHandle.$('span')).toBeTruthy(); | 
					
						
							|  |  |  |   expect(await divHandle.$eval('span', e => e.textContent)).toBe('hello'); | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  |   await popup.waitForLoadState('domcontentloaded'); | 
					
						
							|  |  |  |   await page.evaluate(() => { | 
					
						
							|  |  |  |     const div = document.querySelector('div'); | 
					
						
							| 
									
										
										
										
											2020-08-28 19:20:29 +08:00
										 |  |  |     window['__popup'].document.body.appendChild(div); | 
					
						
							| 
									
										
										
										
											2020-08-04 06:23:53 +08:00
										 |  |  |   }); | 
					
						
							|  |  |  |   expect(await divHandle.$('span')).toBeTruthy(); | 
					
						
							|  |  |  |   expect(await divHandle.$eval('span', e => e.textContent)).toBe('hello'); | 
					
						
							|  |  |  | }); | 
					
						
							|  |  |  | 
 | 
					
						
							| 
									
										
										
										
											2021-09-28 00:58:08 +08:00
										 |  |  | it('should query existing elements', async ({ page, server }) => { | 
					
						
							| 
									
										
										
										
											2020-08-04 06:23:53 +08:00
										 |  |  |   await page.setContent('<html><body><div>A</div><br/><div>B</div></body></html>'); | 
					
						
							|  |  |  |   const html = await page.$('html'); | 
					
						
							|  |  |  |   const elements = await html.$$('div'); | 
					
						
							|  |  |  |   expect(elements.length).toBe(2); | 
					
						
							|  |  |  |   const promises = elements.map(element => page.evaluate(e => e.textContent, element)); | 
					
						
							|  |  |  |   expect(await Promise.all(promises)).toEqual(['A', 'B']); | 
					
						
							|  |  |  | }); | 
					
						
							|  |  |  | 
 | 
					
						
							| 
									
										
										
										
											2021-09-28 00:58:08 +08:00
										 |  |  | it('should return empty array for non-existing elements', async ({ page, server }) => { | 
					
						
							| 
									
										
										
										
											2020-08-04 06:23:53 +08:00
										 |  |  |   await page.setContent('<html><body><span>A</span><br/><span>B</span></body></html>'); | 
					
						
							|  |  |  |   const html = await page.$('html'); | 
					
						
							|  |  |  |   const elements = await html.$$('div'); | 
					
						
							|  |  |  |   expect(elements.length).toBe(0); | 
					
						
							|  |  |  | }); | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | 
 | 
					
						
							| 
									
										
										
										
											2021-09-28 00:58:08 +08:00
										 |  |  | it('xpath should query existing element', async ({ page, server }) => { | 
					
						
							| 
									
										
										
										
											2020-08-04 06:23:53 +08:00
										 |  |  |   await page.goto(server.PREFIX + '/playground.html'); | 
					
						
							|  |  |  |   await page.setContent('<html><body><div class="second"><div class="inner">A</div></div></body></html>'); | 
					
						
							|  |  |  |   const html = await page.$('html'); | 
					
						
							|  |  |  |   const second = await html.$$(`xpath=./body/div[contains(@class, 'second')]`); | 
					
						
							|  |  |  |   const inner = await second[0].$$(`xpath=./div[contains(@class, 'inner')]`); | 
					
						
							|  |  |  |   const content = await page.evaluate(e => e.textContent, inner[0]); | 
					
						
							|  |  |  |   expect(content).toBe('A'); | 
					
						
							|  |  |  | }); | 
					
						
							|  |  |  | 
 | 
					
						
							| 
									
										
										
										
											2021-09-28 00:58:08 +08:00
										 |  |  | it('xpath should return null for non-existing element', async ({ page, server }) => { | 
					
						
							| 
									
										
										
										
											2020-08-04 06:23:53 +08:00
										 |  |  |   await page.setContent('<html><body><div class="second"><div class="inner">B</div></div></body></html>'); | 
					
						
							|  |  |  |   const html = await page.$('html'); | 
					
						
							|  |  |  |   const second = await html.$$(`xpath=/div[contains(@class, 'third')]`); | 
					
						
							|  |  |  |   expect(second).toEqual([]); | 
					
						
							|  |  |  | }); |