Puppeteer - 處理連結/按鈕

Puppeteer 能夠處理頁面上的連結/按鈕。在點選元素之前，我們必須能夠使用任何定位器唯一地識別它。在 Puppeteer 中，只有當元素的尺寸大於零畫素時，我們才能點選它。

在下圖中，我們將點選下面突出顯示的連結 - “訂閱高階計劃”，其標籤名為 h1。

首先，請按照 Puppeteer 中“基本測試”章節中的步驟 1 到 2 操作，步驟如下：

步驟 1 - 在建立 node_modules 資料夾的目錄中建立一個新檔案（Puppeteer 和 Puppeteer 核心已安裝的位置）。

有關 Puppeteer 安裝的詳細資訊在“Puppeteer 安裝”章節中進行了討論。

右鍵單擊建立 node_modules 資料夾的資料夾，然後單擊“新建檔案”按鈕。

步驟 2 - 輸入檔名，例如 testcase1.js。

步驟 3 - 將以下程式碼新增到建立的 testcase1.js 檔案中。

//Puppeteer library
const pt= require('puppeteer')
async function clickElement(){
   //launch browser in headless mode
   const browser = await pt.launch()
   //browser new page
   const page = await browser.newPage()
   //launch URL
   await page.goto('https://tutorialspoint.tw/index.htm')
   //identify element then click
   await page.click('h1');
   //get page title after click
   console.log(await page.title())
}
clickElement()

步驟 4 - 使用以下命令執行程式碼：

node <filename>

因此，在我們的示例中，我們將執行以下命令：

node testcase1.js

命令成功執行後，點選連結“訂閱高階計劃”後獲得的標題 - “Tutorials Point 付費訂閱套餐 - Tutorialspoint” 將列印到控制檯。