2020-08-20: Automating Posting Videos to Instagram with BrowserStack's Appium Automation Framework

Recently, I have been working on enhancing an old project, WhatDidItLookLike. This project focuses on summarizing a URI by generating an animated GIF of what it looked like over the years. Users send in requests by simply tweeting out #whatdiditlooklike [URI]. 

A screenshot for the first memento of each year is captured for the requested URI. These screenshots are then combined and used to generate a GIF. Currently, the GIF is posted to Tumblr and it can be viewed at whatdiditlooklike.mementoweb.org

https://whatdiditlooklike.mementoweb.org/post/179447252314/what-did-httpswwwcnncom-look-like-from-2000

My goal was to share this GIF on Instagram. Instagram does not support GIFs so a workaround is to post a video instead. Using Instagram on a browser with a mobile device user-agent allows the user to post pictures only. The browser approach didn’t work for me as I needed to post a video. It seems that Instagram only allowed posting videos through a mobile app so I looked at a few online android emulators and here’s what I found: 

  1. ApkOnline: Free to use, only available for Android platform.
  2. Appetize.io: Paid but has a reasonable trial version (1 concurrent session and 100mins/month). Available for both iOS and Android platforms.
  3. BrowserStack: Free plan includes visual testing and app automation. A free 30min trial for live app testing is also provided to new users. Available for iOS, Android, Windows, and MacOS platforms.
  4. RunThatApp: Paid (0.05/min). Available for both iOS and Android platforms.
I decided to try out ApkOnline first as that was the 100% free option. I was able to successfully install Instagram but the app kept crashing as I tried to launch it. I soon realized that even though the app worked, there was no way for me to programmatically interact with it. 

Instagram app installed on ApkOnline emulator crashes upon launch

My next choice was BrowserStack as their free plan was enough to help me accomplish my goal. There are three different types of interaction frameworks supported by BrowserStack, namely:
  1. Appium: This is an open source tool that can be used on both Android and iOS devices. Appium focuses on black box testing which means that the developer is not required to know how the code works in order to write tests. The client libraries are available for Python, Java, Ruby, JavaScript, PHP, and C#.
  2. Espresso: This tool is developed by Google and is designed for mainly functional UI testing Android apps. Espresso is meant to be used for white box testing which means that it is required for the developer writing the tests to know the code of the application and how it runs.
  3. XCUI: This is a tool by Apple that helps to automate iOS and OS X testing. XCUI may be used for black box testing.
WhatDidItLookLike is written in Python and Appium is the only framework out of the three that provides client libraries for Python. Another reason for choosing the Appium framework is that since it is focused on black box testing, I am not required to know and understand the code for Instagram. Appium works very similar to the element selection developer tool in popular browsers such as Chrome, Firefox, and Safari. I used the UI Automator Viewer developed by Google to acquire class and ID values of elements on the current screen. Both physical and Android emulator devices are compatible with this tool. 

Google Pixel 3 emulated using the Android Emulator

Physical devices require USB debugging to be turned on under Developer Options in Settings and the Android Debug Bridge (ADB) interface is used to communicate with the device. The UI Automator Viewer takes a screenshot and grabs the XML snapshot of the current screen. The tool then maps each element of the XML dump to the screenshot. 

Screenshot and XML content from the emulator captured and displayed on UI Automator Viewer

Using this method, I was able to get all necessary information to write an Appium script that would interact with an Android phone and post the generated video. Before the Appium session is initiated, I upload the video to BrowserStack servers and launch the session with that media loaded in the device. I am also able to obtain the link to that Instagram post since Appium provides support for clipboard interaction. I delete the media after terminating the session in order to save space since there is a storage limitation under the free plan.

Summary of the screens visited to post to Instagram using Appium

All of the code is available on my GitHub at github.com/dhruv282/wdill. The code for the web browser approach can be found in the instagram.js file. The Appium script used to accomplish this goal is located in the instagramWithBrowserStack.py file.

- Dhruv Patel (@dhruv_282)

Comments