This article is for Flatfile's Portal 2.0. If you'd like to check out the latest version of the Flatfile Data Exchange Platform, click here!
The method of including Flatfile’s importer within an iframe in your application’s automated tests will vary widely depending on what automated testing framework you are using. Flatfile’s teams have had success testing Flatfile within iframes using Playwright. Playwright is not the only solution, but it is a good starting point.
You will need to change a few settings and parameters for this test to work with your setup. These instructions are specific to using Playwright as a test environment, so some additional modifications may be needed.
First, in `TestHarnessPage.ts`, change `await this.page.goto(...)` to point to the correct page in your app that contains Flatfile Portal 2.0.
Next, we’ll take a look at `frameUrl.startsWith(...)`. This is used to detect the Portal 2.0 iframe once it has loaded and start issuing commands to it. For this testing environment, use https://portal-2.flatfile.io/.
Finally, in `playwright.config.ts`, change the `baseUrl` to your app.
You can run the test using `npm install` and then `./node_modules/.bin/playwright test`.
When it is run, it will test:
If there is one test script (`upload.test.ts`)
Uploading a CSV file
Uploading an XLSX file