Get Started

Project Wiki 📚

Welcome to the appium-flutter-integration-driver Wiki! Here, you'll find all the information you need to get started with our open-source project. Whether you're using WDIO or the Appium Java-client, this guide will help you set up and use the driver for Flutter contexts.

Table of Contents 📖

1. Installing WDIO Flutter By Service 🛠️
2. Adding Appium Java-client Dependency 📦
3. Examples 💡
   • WDIO Examples 🌐
   • Java-client Examples ☕

---

Installing WDIO Flutter By Service 🛠️

To integrate the wdio-flutter-by-service into your WebdriverIO setup, run the following command from your project root directory:

npm i wdio-flutter-by-service

This package provides support for locating elements in Flutter contexts using WebdriverIO.

---

Adding Appium Java-client Dependency 📦

If you're using the Appium Java-client, you need to add the appropriate dependency to your gradle or pom.xml file.

For Gradle (build.gradle)

Add the following implementation line to your build.gradle file:

// https://mvnrepository.com/artifact/com.github.saikrishna321/flutter
implementation group: 'com.github.saikrishna321', name: 'flutter', version: '1.0'

For Maven (pom.xml)

Add the following dependency to your pom.xml file:

<!-- https://mvnrepository.com/artifact/com.github.saikrishna321/flutter -->
<dependency>
    <groupId>com.github.saikrishna321</groupId>
    <artifactId>flutter</artifactId>
    <version>1.0</version>
</dependency>

---

Finding Elements in Flutter Context 🔍

The driver supports finding elements in a Flutter context using the following locators:

• text
• semantics label
• type
• key

---

Examples 💡

WDIO Examples 🌐

Example 1: Locate Element by Key 🗝️

const loginButton = await browser.flutterByValueKey$('login_button');
await loginButton.click();

Example 2: Locate Element by Text 📝

const loginButton = await browser.flutterByText$('Login');
await loginButton.click();

Example 3: Locate Element by Semantics Label 🔍

const loginButton = await browser.flutterBySemanticsLabel$('login_button');
await loginButton.click();

Example 4: Locate Multiple Elements by Semantics Label 🔄

const toggleButton = await browser.flutterBySemanticsLabel$('toggle_button');
await toggleButton.click();

const messageFields = await browser.flutterBySemanticsLabel$$('message_field');
console.log(messageFields.length); // Outputs the number of elements found

Example 5: Wait for Element Visibility ⏳

const message = await browser.flutterBySemanticsLabel$('message_field');

// Wait for the element to be absent
await browser.flutterWaitForAbsent({ element: message, timeout: 10 });

// Wait for the element to be visible
await browser.flutterWaitForVisible({ element: message, timeout: 10 });

Example 6: Scroll Till Element is Visible 🔄

await browser.flutterScrollTillVisible({
    finder: await browser.flutterByText('Java'),
    scrollDirection: 'up',
});

Example 7: Long Press 🖱️

const longPressElement = await browser.flutterBySemanticsLabel$('long_press_button');
await browser.flutterLongPress({ element: longPressElement });

Example 8: Double Click 🖱️🖱️

const doubleTapElement = await browser.flutterBySemanticsLabel$('double_tap_button');
await browser.flutterDoubleClick({ element: doubleTapElement });

Example 9: Drag and Drop 🖱️➡️

const dragElement = await browser.flutterBySemanticsLabel$('drag_me');
const dropElement = await browser.flutterBySemanticsLabel$('drop_zone');
await browser.flutterDragAndDrop({
    source: dragElement,
    target: dropElement,
});

Example 10: Retrieve Element Properties 📝

const switchButton = await browser.flutterBySemanticsLabel$('switch_button');
const allAttributes = await switchButton.getAttribute('all'); // Will return all attributes attached to the element
console.log(allAttributes);

Java-client Examples ☕

Example 1: Locate Element by Key 🗝️

WebElement loginButton = driver.findElement(FlutterBy.key("login_button"));
loginButton.click();

Example 2: Locate Element by Text 📝

WebElement loginButton = driver.findElement(FlutterBy.text("Login"));
loginButton.click();

Example 3: Locate Element by Semantics Label 🔍

WebElement loginButton = driver.findElement(FlutterBy.semanticsLabel("login_button"));
loginButton.click();

Example 4: Locate Multiple Elements by Semantics Label 🔄

WebElement toggleButton = driver.findElement(FlutterBy.semanticsLabel("toggle_button"));
toggleButton.click();

List<WebElement> messageFields = driver.findElements(FlutterBy.semanticsLabel("message_field"));
System.out.println(messageFields.size()); // Outputs the number of elements found

Example 5: Wait for Element Visibility ⏳

WebElement messageField = driver.findElement(FlutterBy.semanticsLabel("message_field"));
WebElement toggleButton = driver.findElement(FlutterBy.semanticsLabel("toggle_button"));

WaitForOptions waitOption = new WaitForOptions()
        .setElement(messageField)
        .setTimeout(Duration.ofSeconds(10));
Assertions.assertEquals(messageField.getText(), "Hello world");

toggleButton.click();
FlutterCommands.waitForInVisible(driver, waitOption);
Assertions.assertEquals(driver.findElements(FlutterBy.semanticsLabel("message_field")).size(), 0);

toggleButton.click();
FlutterCommands.waitForVisible(driver, waitOption);

Example 6: Scroll Till Element is Visible 🔄

ScrollOptions scrollOptions = new ScrollOptions(FlutterBy.text("Java"), ScrollOptions.ScrollDirection.UP);
WebElement element = FlutterCommands.scrollTillVisible(driver, scrollOptions);
element.click();

Example 7: Long Press 🖱️

WebElement longPressButton = driver.findElement(FlutterBy.semanticsLabel("long_press_button"));
FlutterCommands.performLongPress(driver, new LongPressOptions().setElement(longPressButton));

Example 8: Double Click 🖱️🖱️

WebElement doubleTap = driver.findElement(FlutterBy.semanticsLabel("double_tap_button"))
                             .findElement(FlutterBy.text("Double Tap"));
FlutterCommands.performDoubleClick(driver, new DoubleClickOptions()
        .setElement(doubleTap)
        .setPoint(new Point(10, 0))
);

Example 9: Drag and Drop 🖱️➡️

WebElement dragElement = driver.findElement(FlutterBy.semanticsLabel("drag_me"));
WebElement dropElement = driver.findElement(FlutterBy.semanticsLabel("drop_zone"));
FlutterCommands.performDragAndDrop(driver, new DragAndDropOptions(dragElement, dropElement));

Example 10: Retrieve Element Properties 📝

WebElement switchButton = driver.findElement(FlutterBy.semanticsLabel("switch_button"));
String allAttributes = switchButton.getAttribute("all"); // Will return all attributes attached to the element
System.out.println(allAttributes);

Feel free to explore and contribute to our project. If you have any questions or suggestions, don't hesitate to reach out!