Scroll / Swipe Action Android and iOS

[adittriyadiii]

Hi guys, can i ask something about scroll or swipe action on webdriverio for android and ios? because i already try many ways but still not working, i working on project wdio android and ios with appium cucumber for automation mobile app

[christian-bromann]

Check out some of the helpers we have in the Appium boilerplate project. They might help you!

[adittriyadiii]

Ah thankyou! hm its using TypeScript ya, because im using javascript, many people use typescript rightnow should i change too for project wdio? @christian-bromann

[adittriyadiii]

@christian-bromann chris sorry i want ask about Appium boilerplate project that u share before because im very curious , on that project what version node js do u use?

i use node js 20 and wdio v8 also im trying using typescript

this my package.json

{
{
  "name": "my-new-project",
  "devDependencies": {
    "@babel/cli": "^7.22.10",
    "@babel/core": "^7.22.10",
    "@babel/preset-env": "^7.22.10",
    "@babel/register": "^7.22.5",
    "@wdio/appium-service": "^8.15.4",
    "@wdio/cli": "^8.15.5",
    "@wdio/cucumber-framework": "^8.15.4",
    "@wdio/local-runner": "^8.15.4",
    "@wdio/spec-reporter": "^8.15.0",
    "appium-uiautomator2-driver": "^2.29.5",
    "ts-node": "^10.9.1",
    "typescript": "^4.9.5"
  },
  "scripts": {
    "wdio": "wdio run ./config/wdio.conf.ts"
  }
}

tsconfig.json

{
    "compilerOptions": {
        "module": "commonjs",
        "target": "es2019",
        "types": [
            "node",
            "@wdio/globals/types",
            "expect-webdriverio",
            "@wdio/cucumber-framework",
            "@wdio/appium-service"
        ]
    },
    "include": [
        "./config/**/*.ts",
        "./features/**/*.ts"
    ]

}

First,

but im getting this error

Cannot use import statement outside a module
/Users/wdio.conf.ts:1
import type { Options } from '@wdio/types'
^^^^^^

SyntaxError: Cannot use import statement outside a module

this error can resolve when i add type on package.json , but i see your project can using import outside module without add the type module

"type": "module",

Second,

but if i delete the import and im using your code on wdio.conf.ts like this

/**
 * All not needed configurations, for this boilerplate, are removed.
 * If you want to know which configuration options you have then you can
 * check https://webdriver.io/docs/configurationfile
 */
export const config: WebdriverIO.Config = {
    //
    // ====================
    // Runner Configuration
    // ====================
    // WebdriverIO allows it to run your tests in arbitrary locations (e.g. locally or
    // on a remote machine).
    runner: "local",
    //
    // ==================
    // Specify Test Files
    // ==================
    // The test-files are specified in:
    // - wdio.android.browser.conf.ts
    // - wdio.android.app.conf.ts
    // - wdio.ios.browser.conf.ts
    // - wdio.ios.app.conf.ts
    //
    /**
     * NOTE: This is just a place holder and will be overwritten by each specific configuration
     */
    specs: [],
    //
    // ============
    // Capabilities
    // ============
    // The capabilities are specified in:
    // - wdio.android.browser.conf.ts
    // - wdio.android.app.conf.ts
    // - wdio.ios.browser.conf.ts
    // - wdio.ios.app.conf.ts
    //
    /**
     * NOTE: This is just a place holder and will be overwritten by each specific configuration
     */
    capabilities: [],
    //
    // ===================
    // Test Configurations
    // ===================
    // Define all options that are relevant for the WebdriverIO instance here
    //
    // Level of logging verbosity: trace | debug | info | warn | error | silent
    logLevel: "debug",
    // Set specific log levels per logger
    // loggers:
    // - webdriver, webdriverio
    // - @wdio/applitools-service, @wdio/browserstack-service, @wdio/devtools-service, @wdio/sauce-service
    // - @wdio/mocha-framework, @wdio/jasmine-framework
    // - @wdio/local-runner
    // - @wdio/sumologic-reporter
    // - @wdio/cli, @wdio/config, @wdio/utils
    // Level of logging verbosity: trace | debug | info | warn | error | silent
    // logLevels: {
    //     webdriver: 'info',
    //     '@wdio/applitools-service': 'info'
    // },
    //
    // If you only want to run your tests until a specific amount of tests have failed use
    // bail (default is 0 - don't bail, run all tests).
    bail: 0,
    // Set a base URL in order to shorten url command calls. If your `url` parameter starts
    // with `/`, the base url gets prepended, not including the path portion of your baseUrl.
    // If your `url` parameter starts without a scheme or `/` (like `some/path`), the base url
    // gets prepended directly.
    baseUrl: "http://the-internet.herokuapp.com",
    // Default timeout for all waitFor* commands.
    /**
     * NOTE: This has been increased for more stable Appium Native app
     * tests because they can take a bit longer.
     */
    waitforTimeout: 45000,
    // Default timeout in milliseconds for request
    // if browser driver or grid doesn't send response
    connectionRetryTimeout: 120000,
    // Default request retries count
    connectionRetryCount: 3,
    // Test runner services
    // Services take over a specific job you don't want to take care of. They enhance
    // your test setup with almost no effort. Unlike plugins, they don't add new
    // commands. Instead, they hook themselves up into the test process.
    //
    // Services are empty here but will be defined in the
    // - wdio.shared.browserstack.conf.ts
    // - wdio.shared.local.appium.conf.ts
    // - wdio.shared.sauce.conf.ts
    // configuration files
    services: [],
    // Framework you want to run your specs with.
    // The following are supported: Mocha, Jasmine, and Cucumber
    // see also: https://webdriver.io/docs/frameworks
    //
    // Make sure you have the wdio adapter package for the specific framework installed
    // before running any tests.
    framework: "mocha",
    // The number of times to retry the entire specfile when it fails as a whole
    // specFileRetries: 1,
    //
    // Delay in seconds between the spec file retry attempts
    // specFileRetriesDelay: 0,
    //
    // Whether or not retried specfiles should be retried immediately or deferred to the end of the queue
    // specFileRetriesDeferred: false,
    //
    // Test reporter for stdout.
    // The only one supported by default is 'dot'
    // see also: https://webdriver.io/docs/dot-reporter
    reporters: ["spec"],
    // Options to be passed to Mocha.
    mochaOpts: {
        ui: "bdd",
        /**
         * NOTE: This has been increased for more stable Appium Native app
         * tests because they can take a bit longer.
         */
        timeout: 3 * 60 * 1000, // 3min
    },
    //
    // =====
    // Hooks
    // =====
    // WebdriverIO provides several hooks you can use to interfere with the test process in order to enhance
    // it and to build services around it. You can either apply a single function or an array of
    // methods to it. If one of them returns with a promise, WebdriverIO will wait until that promise got
    // resolved to continue.
    //
    /**
     * NOTE: No Hooks are used in this project, but feel free to add them if you need them.
     */
};

its returning error too

/Users/wdio.conf.ts:6
export const config: WebdriverIO.Config = {
^^^^^^
SyntaxError: Unexpected token 'export'

[christian-bromann]

Make sure to set this: "module": "commonjs", to "module": "ESNext",

[adittriyadiii]

but why you can use "module": "commonjs" and not getting error?

[christian-bromann]

don't set "module": "commonjs" if you want to use ESM. I recommend using "module": "ESNext",

[adittriyadiii]

honestly i want using commonjs and use babel for using import , but still getting error , just a little bit confused why on that project can using common js and import from esm

[sangmai]

Any update for this one. I'm using this code but it works on ios only, any solution for Android ?

[adiittriyadi]

you can use this for simple scroll / swipe

static async tapByCoordinate(x: number, y: number) {
        const coordinate = { x, y };
        await browser.touchPerform([
          {
            action: 'tap',
            options: coordinate
          }
        ]);}

or u can use code inside this repo helpers its work both android and iOS

[EdiardoCoDi]

Thank you!!! This resolves every problem.

[AbidKhairyAK]

i get this from the helper file that @christian-bromann provided

import { driver } from '@wdio/globals'

await driver
            // a. Create the event
            .action('pointer')
            // b. Move finger into start position
            .move(fromX, fromY) // This can also be written as .move({ x: fromX, y: fromY }) which allows you to add more options
            // c. Finger comes down into contact with screen
            .down() // This can also be written as .down({ button:0 }) which allows you to add more options
            // d. Pause for a little bit
            .pause(100)
            // e. Finger moves to end position
            // IMPORTANT. The default duration, if you don't provide it, is 100ms. This means that the movement will be so fast that it:
            // - might not be registered
            // - might not have the correct result on longer movements.
            // Short durations will move elements on the screen over longer move coordinates very fast.
            // Play with the duration to make the swipe go slower / faster
            .move({ duration: 500, x: toX, y: toY })
            // f. Finger gets up, off the screen
            .up() // this can also be written as .up({ button:0 }) which allows you to add more options
            // g. Perform the action
            .perform();

here's clean example

import { driver } from '@wdio/globals'

await driver
	.action('pointer')
	.move({ x: 250, y: 600 })
	.down()
	.pause(100)
	.move({ duration: 500, x: 250, y: 150 })
	.up()
	.perform();

idk why such simple task like scrolling is not properly documented on wdio appium website

btw I'm using wdio + appium + UiAutomator2