자동화된 브라우저 테스트는 모든 웹 개발자가 애플리케이션이 올바르게 작동하는지 확인하는 데 필수입니다. 이 게시물에서는 간단한 브라우저 작업(웹페이지 열기 및 버튼 클릭)을 자동화하기 위해 JavaScript로 Selenium을 설정하는 방법을 안내합니다.
따라가려면 다음이 필요합니다.
먼저 프로젝트를 위한 새 폴더를 만듭니다. 터미널을 열고 다음을 실행하세요.
mkdir selenium-test cd selenium-test
다음으로 새 Node.js 프로젝트를 초기화합니다.
npm init -y
이 명령은 프로젝트의 종속성을 추적하는 package.json 파일을 생성합니다.
npm을 사용하여 Selenium WebDriver 및 ChromeDriver를 설치합니다.
npm install selenium-webdriver chromedriver --save
이러한 패키지는 Selenium으로 Chrome을 자동화하는 데 필요한 라이브러리와 도구를 제공합니다.
프로젝트 폴더에 test.js라는 새 파일을 만듭니다. 이 스크립트는 웹페이지를 열고 버튼이 클릭 가능해질 때까지 기다린 다음 클릭합니다.
const { Builder, By, until } = require('selenium-webdriver'); const chrome = require('selenium-webdriver/chrome'); // Helper function to pause the script function sleep(ms) { return new Promise(resolve => setTimeout(resolve, ms)); } async function runTest() { // Configure Chrome to suppress unwanted prompts let options = new chrome.Options(); options.addArguments('--no-default-browser-check', '--no-first-run', '--disable-default-apps', '--disable-infobars'); let driver = await new Builder() .forBrowser('chrome') .setChromeOptions(options) .build(); try { // Open the target webpage await driver.get('https://example.com'); // Change this URL to the site you want to test // Wait for an element to load await driver.wait(until.elementLocated(By.className('sample-class')), 10000); console.log('Found element with class "sample-class".'); // Generic wait for 6 seconds to handle any dynamic content await sleep(6000); // Wait for the button to be clickable await driver.wait(until.elementLocated(By.id('sample-button')), 10000); // Re-locate the button to ensure it’s still in the DOM let button = await driver.findElement(By.id('sample-button')); console.log('Button located:', button); // Click the button await button.click(); console.log('Button clicked successfully.'); // Wait for the next page or action to load await driver.wait(until.urlContains('new-page'), 10000); console.log('Navigation to new page was successful.'); } catch (error) { console.error('Error during the test:', error); } finally { // Always close the browser await driver.quit(); } } runTest();
스크립트를 실행하려면 다음을 실행하세요.
node test.js
Chrome이 열리고 스크립트에 정의된 작업을 수행합니다. 각 단계의 진행 상황을 나타내는 로그를 콘솔에서 확인하세요.
이제 Selenium과 JavaScript를 사용하여 자동화된 브라우저 테스트를 위한 기본 설정이 완료되었습니다. 이 설정은 보다 복잡한 상호 작용, 확인 및 검증 단계를 포함하도록 쉽게 확장할 수 있습니다.
브라우저 버전과 일치하도록 드라이버를 업데이트하고 CI/CD 환경에 헤드리스 모드를 사용하는 것을 고려해 보세요.
Azure에서 호스팅하려면 내 다른 게시물을 확인하세요: https://dev.to/iamrule/how-to-azure-host-a-selenium-javascript-node-application-in-azure-and -실패 시 이메일 알림 보내기-2aio
즐거운 테스트를 해보세요!
위 내용은 JS 방법: Selenium으로 테스트 자동화의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!