Midscene.js: AI로 브라우저 자동화 테스트를 구동하는 오픈 소스 플러그인

최신 AI 리소스7개월 전 업데이트 AI 공유 서클
3.2K 00

일반 소개

Midscene.js는 자연어 명령을 통해 웹 페이지를 제어하고 어설션을 실행하며 데이터를 추출할 수 있는 AI 기반 브라우저 자동화 도구입니다. 이 도구는 Chrome 확장 프로그램, JavaScript SDK 및 YAML 스크립트를 지원하여 UI 테스트 작성 및 유지 관리 프로세스를 간소화합니다. GPT-4o와 같은 멀티모달 빅 언어 모델을 활용하여 사용자가 웹 페이지와 직관적으로 상호 작용하고 구조화된 JSON 데이터를 가져올 수 있는 새로운 자동화된 개발 환경을 제공하는 Midscene.js.

바이트 오픈 소스 Midscene.js, 자연어 + 인터페이스 스크린샷이 직접 E2E 테스트를 생성하여 팀의 수많은 반복 노동 시간을 절약하고, 현재 코딩 + 멀티모달 기능으로 많은 기본 E2E 문제를 해결하는 것은 매우 완벽합니다.

Midscene.js:用AI驱动浏览器自动化测试的开源插件

 

Midscene.js:用AI驱动浏览器自动化测试的开源插件

 

기능 목록

  • 자연어 상호 작용단계를 설명하는 자연어를 사용하여 AI가 자동으로 사용자 인터페이스를 계획하고 제어합니다.
  • JSON 데이터 추출사용자 요구사항에 따라 JSON 형식의 응답 데이터를 자동으로 생성합니다.
  • 직관적인 어설션어설션은 자연어로 이루어지며, AI가 이를 이해하고 실행합니다.
  • Chrome 확장 프로그램 환경확장 기능으로 경험을 시작하기 위해 코드를 작성할 필요가 없습니다.
  • 시각화 보고서사용자가 프로세스를 이해하고 디버깅할 수 있도록 자세한 구현 보고서를 제공합니다.
  • 여러 스크립트 지원자바스크립트 및 YAML을 포함하여 유연한 자동 스크립팅을 제공합니다.

 

도움말 사용

설치 및 구성

Chrome 확장 프로그램을 설치합니다:

  1. Chrome 스토어를 방문하여 '미드신'을 검색합니다.
  2. 'Chrome에 추가' 버튼을 클릭합니다.
  3. 설치를 확인하고 권한을 허용합니다.

환경 변수를 구성합니다(SDK 사용 시):

  • OpenAI API를 사용하려면 다음을 생성해야 합니다..env파일에 다음을 추가합니다:
export OPENAI_API_KEY="你的API密钥"
export MIDSCENE_MODEL_NAME="gpt-4o"
  • 다른 모델 서비스를 사용하는 경우에는 위의 환경 변수를 적절히 조정해야 합니다.

사용 프로세스

Chrome 확장 프로그램을 통해 사용

  • 확장 프로그램 실행: 설치 후 브라우저 도구 모음에 확장 아이콘이 표시됩니다. 아이콘을 클릭하면 미드씬 제어판이 열립니다.
  • 대화형 작업제어판에서 "로그인 버튼 클릭" 또는 "웹 페이지에서 모든 제목 추출"과 같은 자연어 명령을 입력합니다.
  • 결과 보기: 작업이 완료되면 확장 프로그램은 실행 결과를 반환하며, 일반적으로 추출된 데이터를 JSON 형식으로 표시합니다.

자바스크립트 SDK를 통해 사용

  • SDK 소개::
    import { ai, aiQuery, aiAssert } from'@midscene/web';
    
  • 실행 가능한 작업::
    • 기본 조작사용ai함수는 간단한 웹 페이지 작업을 수행합니다. 예시:
      await ai('在搜索框中输入 "React"');
      
    • 데이터 추출사용aiQuery를 클릭해 데이터를 추출합니다:
      const data = await aiQuery('{title: string, price: number}[]', '找到产品列表并提取标题和价格');
      
    • 어설션 검사: 활용도aiAssert주장하기:
      await aiAssert('页面上应该有登录按钮');
      

YAML 스크립트 사용

  • YAML 스크립트 작성예를 들어 **.yaml** 파일에 자동화 작업을 정의합니다:
    -action:type
    selector:'input[name="search"]'
    value:'JavaScript'
    -action:click
    selector:'button[type="submit"]'
    
  • 실행 스크립트명령줄 도구 또는 미드씬의 CLI를 통해 이 스크립트를 실행합니다.

운영 세부 정보

  • 자연어 교육"클릭", "입력"과 같이 간단하거나 "'세일'이라고 표시된 모든 제품을 찾아 가격을 기록하세요!"와 같이 복잡할 수 있습니다. ".
  • 오류 처리: 작업이 실패하면 미드씬은 실패 원인을 나타내는 자세한 보고서를 제공하고 명령을 조정하는 데 도움을 줍니다.
  • 디버그 및 재생각 테스트 또는 작업의 실행을 시각적 보고서와 함께 재생하여 스크립트를 이해하거나 디버깅하는 데 도움을 받을 수 있습니다.

이 자세한 사용 가이드를 통해 사용자는 빠르게 속도를 높이고 효율적인 브라우저 자동화 테스트를 위해 Midscene.js 기능을 최대한 활용할 수 있습니다.

© 저작권 정책

관련 문서

댓글 없음

댓글에 참여하려면 로그인해야 합니다!
지금 로그인
없음
댓글 없음...