How to Automate WeChat Mini‑Program Testing with miniprogram‑automator

1. Why automate Mini‑Program testing

WeChat mini‑programs have become increasingly complex, with many pages and diverse business logic, which requires developers to manually verify a large number of test cases to ensure expected behavior; automation can replace this repetitive work.

2. First try miniprogram‑automator

miniprogram‑automator provides the following capabilities after connecting to the development‑tool automation interface:

MiniProgram : obtain mini‑program information (page stack, system info, page content) and control the mini‑program (navigate, switch tab, call methods).

Page : obtain page information (path, elements, data, structure) and control the page (set render data, call methods).

Element : obtain element information (attributes, style, content, position) and manipulate elements (click, long‑press, call methods).

To start the automation service, open the development‑tool command line with the appropriate version (>= v1.02.1906042) and run:

<code>PS D:\programs\内测\微信开发者工具> ./cli.bat --auto D\微信开发者工具 --auto-port 9420
Initializing...
idePortFile: C:\Users\billcui\AppData\Local\微信开发者工具\UserData\Default\.ide
starting ide...
IDE server has started, listening on http://127.0.0.1:35510
initialization finished
Open project with automation enabled success D: \weApp\testMiniprogram</code>

Notes:

The developer‑tool version must be higher than v1.02.1906042; the author used v1.03.1906062.

Before running the command, enable the service port in Settings → Security Settings → Service Port.

The automation port is independent of the service port; look for the "Open project with automation enabled success" log to confirm the port (9420) is open.

Install the SDK and create a test file:

<code>npm i miniprogram-automator --save-dev</code>

Connect to the automation port in your test code:

<code>const automator = require('miniprogram-automator');
const miniProgram = await automator.connect({ wsEndpoint: 'ws://localhost:9420' });</code>

3. Applying automation to the Classroom Mini‑Program

The goal is to automate verification of the paid‑course detail page, which includes a purchase button, trial video, and playback restrictions for unpurchased courses.

Verify the button shows “立即购买” and navigates to the payment page.

Click the trial button and confirm the preview video plays.

Ensure that an unpurchased video cannot be played.

Example Jest test structure:

<code>describe('课堂小程序自动化测试', () => {
  let miniProgram;
  beforeAll(async () => {
    miniProgram = await automator.connect({ wsEndpoint: 'ws://localhost:9420' });
  });
  afterAll(() => miniProgram.disconnect());

  it('付费课程详情页按钮显示、跳转、点播、试学功能测试', async () => {
    const page = await miniProgram.reLaunch(`/pages/course/course?cid=${commonPayCid}`);
    const basicApplyButton = await page.$('.basic--buy');
    expect(await basicApplyButton.wxml()).toContain('立即购买');
    await basicApplyButton.tap();
    await page.waitFor(1500);
    const currentPage = await miniProgram.currentPage();
    expect(currentPage.path).toContain('pages/order/order');
    await miniProgram.navigateBack();

    // trial video
    const playerVideo = await tapTcplayer(page);
    expect(await playerVideo.wxml()).toContain('video-current-time');

    // unpurchased video should be null
    const playerCover = await page.$('.player-cover');
    const playerVideoNull = await playerCover.$('.component-video-video--player_video');
    expect(playerVideoNull).toBeNull();
  }, 20000);
});

async function tapTcplayer(page, className = '.task-item') {
  const taskItem = await page.$(className);
  await taskItem.tap();
  await page.waitFor(3000);
  const playerCover = await page.$('.player-cover');
  const playerVideo = await playerCover.$('.component-video-video--player_video');
  return playerVideo;
}</code>

Selector limitations require using the actual class names generated by the framework (e.g.,

.basic--buy

instead of

.bottom-btn

) because custom component internals are prefixed.

Video playback is verified by checking the presence of the

video-current-time

element inside the rendered

<video>

component:

<code>&lt;video class="component-video-video--player_video" controls="" ...&gt;
  &lt;div class="video-container"&gt;
    &lt;div class="video-bar full" style="opacity:1;"&gt;
      &lt;div class="video-current-time"&gt;00:02&lt;/div&gt;
      ...
    &lt;/div&gt;
  &lt;/div&gt;
&lt;/video&gt;</code>

Implemented test cases include:

nohost detection

Home page data retrieval, display, navigation

Paid‑course detail page button, navigation, playback, trial

Coupon button display and claim

Limited‑time discount button

Free‑course detail page button, enrollment, playback

Category page display and navigation

4. Issues and limitations

Component selectors only support component name and class; custom component internals require prefixing or dumping the wxml.

Jest snapshot tests can be unstable because the returned wxml may or may not contain

wx:nodeid

attributes.

Automation works only in the development‑tool environment; live streaming cannot be tested and cloud video falls back to tcplayer.

Login, QR‑code scanning, and authorization dialogs cannot be automated because the tool cannot interact with system dialogs.

The

<web-view>

component provides no internal information and cannot be controlled.

Hope these problems will be resolved in future tool updates.