使用 VSCode 編輯測試，並使用 SeeTest 實現自動化。

 

VSCode 概述

VSCode 是微軟推出的一款速度極快的文字編輯器。它是一款功能全面的工具，將易於使用的文字編輯器與高級整合開發環境 (IDE) 結合，讓您可以在一個統一的控制面板中輕鬆編輯、建構和調試測試項目。該工具支援 Windows、Linux 和 Mac 平台。雖然它內建了對 JavaScript、Node.js 和 TypeScript 的支持，但也提供了對其他程式語言（例如 Java、Python、PHP、C++、C#、Go 等）的擴充。此外，它還支援 Unity 和 .NET 等執行時間工具。

VSCode 的歷史

VSCode 不應與 Microsoft Visual Studio 混淆。 Visual Studio 是微軟的產品，已有 20 年的歷史，可在 Windows 和 macOS 平台上運行，但它並非開源軟體。而 VSCode 是基於 Electron 框架，由 GitHub 創建，用於使用 Node.js 開發 GUI 應用程式。它早期被稱為 Atom Shell。微軟於 2015 年接管了該產品並將其開源。

VSCode 是一款輕量級的文字編輯器。同時，它還提供擴展程序，可以將其轉換為功能強大的整合開發環境 (IDE)，讓您能夠使用自己喜歡的程式語言進行開發。此外，它不佔用太多資源，也不需要複雜的安裝步驟。使用這款編輯器，您可以執行任何程式腳本。

它支援所有主流平台，例如 Windows、Linux、macOS 等。它不僅輕巧，而且運行速度遠超其他整合開發環境 (IDE)。透過添加擴充程序，您可以享受功能豐富的文字編輯器。此外，它安裝和使用都非常簡單，只需單擊即可安裝新功能。而且它是免費的。

這款工具發展迅猛，不斷創新。它提供實用的插件、擴充功能和調試支援。 VSCode 擁有活躍的社區，隨時準備好提供與該工具相關的協助。此外，微軟的專門團隊也持續改進這款工具，這是其他開源工具所沒有的。它每月都會發布新版本，產品運作穩定。

安裝

第一步是安裝該工具。之後，您可以新增您選擇的語言副檔名。

步驟1：安裝VSCode

與其他Windows軟體一樣，VSCode的安裝非常簡單。只需下載安裝包，然後雙擊即可完成安裝。

要下載該工具，請訪問以下連結： https://code.visualstudio.com/download

選擇您的平台版本並下載工具。

下載完成後，雙擊該檔案開始安裝。在下一個畫面上，接受許可協議。

在下一個畫面上，選擇目標資料夾和開始功能表選項。

然後，您可以自訂一些選項。選擇「新增至路徑」將 VSCode 路徑新增至系統環境變數。

點選下一步完成安裝。

點擊“完成”，安裝即完成。現在，VSCode 可以使用了。

微軟產品的優點在於其基於圖形使用者介面的友善設計。即使知識儲備有限，也能輕鬆上手使用。

您可以簡單地建立一個 HTML 文件，新增程式碼，然後執行該文件。

現在該工具已準備就緒，可以使用了。

步驟二：新增程式語言擴展

要使用您喜歡的程式語言，您需要在 VSCode 編輯器中新增擴充功能。為此，請開啟 VSCode 編輯器。在左側活動欄中，按一下「擴充功能」圖示。

在搜尋欄中輸入 Java。您可以看到 Java 擴充功能列表。選擇 Java 擴充包。

點擊安裝後，將會安裝 Java 擴充包。它包含六個組件：

1. Java 語言支援
2. Visual Studio IntelliCode
3. Maven for Java
4. Java偵錯工具
5. Java 測試運行器
6. Java專案經理

點擊安裝後，所有六個組件都會被安裝。

安裝擴充包後，開啟 VSCode 編輯器。點擊“檔案”，然後開啟工作區資料夾（例如：ExperitestProject）。

選擇工作區資料夾後，專案資料夾將載入到 VSCode 工作區中。

現在點擊專案工作區旁的新建檔案圖標，建立一個新的Java程式。為檔案命名（例如：sample1.java），然後按下回車鍵。

現在，您可以在編輯器右側看到 Java 檔案。請在那裡添加您的 Java 程式碼。

以下是一個範例程式碼：

[java] /** * sample1 */ public class sample1 { public static void main(String[] args) { System.out.println(“Hello Experitest Users”); } } [/java]

點擊“運行”按鈕，程式就會運行。

程式列印文字“Hello Experitest Users”。

您已成功新增 Java 擴充功能。 Java 程式現在可以正常運作。

步驟 3：建構測試自動化環境

要執行自動化測試腳本，您需要安裝建置工具，例如 Maven 或 Gradle。此外，您還需要新增 Selenium、WebDriverManager 和 TestNG 相依性。

當添加 Java 擴充包時，Maven 也會被安裝。在左下角的選單中，您可以看到「Maven 專案」。點擊旁邊的「新檔案」選項。

選擇一個原型。選擇“archetype-quickstart-jdk8”。

選擇版本。

在下一個畫面上，選擇目標資料夾，然後按一下確定。建置過程開始。

現在，Maven 會要求提供一些詳細信息，例如 groupid、artifactid 等。提供這些資訊後，Maven 將處理建置。

建置成功後，您可以在左側資源管理器中看到專案結構。點選 pom.xml

在 pom.xml 檔案中，您需要新增 Selenium、webdriver manager 和 TestNG 的依賴項。為此，請造訪此處的 Maven 倉庫：

https://mvnrepository.com/

在搜尋欄中輸入 Selenium，然後點選搜尋。

打開 Selenium Java 鏈接，然後點擊最新版本。

複製程式碼，以便將其貼到 pom.xml 檔案中。

現在，打開 pom.xml 文件，並將程式碼貼到 dependency 部分下。

同樣地，搜尋“webdrivermanager”和“TestNG”，複製 pom.xml 檔案中的依賴項程式碼並儲存檔案。您可以看到建置成功的訊息。

執行你的第一個自動化測試腳本

pom.xml 檔案更新後，您可以在左側選單中看到專案結構。在專案名稱下方，右鍵點選 srctestjava 並選擇新建檔案。

為檔案命名，並新增 .java 副檔名（例如：experitest1.java）

現在將以下程式碼新增至文件。

[java] package Experifact.src.test.java.Experipackage; import org.openqa.selenium.WebDriver; import org.openqa.selenium.chrome.ChromeDriver; public class experitest1 { public static void main(String[ System.setProperty(“webdriver.chrome.driver”,”C:\chromedriver_win32\chromedriver.exe”); WebDriver driver=new ChromeDriver(); driver.get(“http://www.experitest.com”); Thread.sleep(3000); driver.quit() ;

運行此程式碼後，它將開啟 Chrome 瀏覽器並開啟 Experitest 網站。

因此，VSCode 已準備好進行基於 Selenium 的測試自動化。

Experitest Cloud 中的測試自動化

Experitest 的 SeeTest 平台是一個全面的測試自動化平台，使開發人員能夠在各種瀏覽器、裝置、平台等上測試他們的應用程式。它還提供了一個直覺的報告工具​​，讓您了解每個測試的運行情況。

• 若要在 SeeTest Cloud 上執行測試腳本，請開啟 VSCode，然後前往專案資源管理器。
• 在 Java 專案 (Experitestproject) 下，以滑鼠右鍵按一下 srctestjavaExperipackage
• 點擊建立新文件
• 為檔案命名，並新增 .java 副檔名（例如：ExperitestCloud.java）。
• 現在將以下程式碼新增至文件：

[java] package Experipackage; import org.openqa.selenium.*; import org.openqa.selenium.remote.BrowserType; import org.openqa.selenium.remote.Capability. import org.opena.selenium.remoteDemenium.remotem; org.openqa.selenium.remote.RemoteWebDriver; import org.openqa.selenium.support.ui.ExpectedConditions; import org.openqa.selenium.support.ui.WebDriverWait; import org.testqa.selenium.support.ui.WebDriverWait; import org.testqa.selenium.support.ui.WebDriverWait; import org.testng.annotportations; org.testng.annotations.Test; import java.net.URL; public class ExperitestCloud { private static final String ACCESS_KEY = “在此輸入您的訪問密鑰。”; private RemoteWebDriver driver; private URL url; void setUp() throws Exception { url = new URL(“https://cloud.seetest.io/wd/hub”); dc.setCapability(CapabilityType.BROWSER_NAME, BrowserType.CHROME); dc.setCapability(CapabilityType.PLATFORMKey,NYa); dc.setCapability(“testName”, “快速入門 Chrome 瀏覽器演示”); driver = new RemoteWebDriver(url, dc); } @Test public void browserTestGoogleSearch() { driver.get(“https://www. 10).until(ExpectedConditions.presenceOfElementLocated(By.name(“q”))); WebElement searchBar = driver.findElement(By.name(“q”)); searchBar.click(); searchBar.sendKeys(“ExperitKeyx”); { System.out.println(“報告 URL: “+ driver.getCapabilities().getCapability(“reportUrl”)); driver.quit(); } } [/java]

現在，運行測試。它將登入 SeeTest 雲端平台，打開 Chrome 瀏覽器，打開 Google 網站，並搜尋關鍵字「Experitest」。

點擊 Java 測試報告後，可以看到測試已通過。

SeeTest Cloud 的一個顯著特徵是其報告功能。

在 SeeTest 雲端平台開啟報告功能後，您可以查看詳細的測試報告。

除了報告之外，它還提供了測試錄影。您可以在報告的右側看到錄影。這樣，您就可以輕鬆了解測試的運作情況。

摘要

VSCode 是一款輕量級的文字編輯器和整合開發環境 (IDE)，支援您喜愛的程式語言。使用這款簡單易用的免費工具，您可以輕鬆執行自動化測試專案。它不僅提供功能豐富的介面和所有必要的擴展，而且不會佔用過多系統資源。此外，它的載入速度很快，測試運行速度也相當快。他們還提供名為 Codespace 的託管環境，您可以… 能夠 在這裡閱讀.

當你結合 SeeTest 雲端的強大功能 有了 VSCode，你還能要求什麼呢？

Guy Arieli – 技術長