> ## Documentation Index
> Fetch the complete documentation index at: https://qawolf-flows-tab-consolidation-outlining.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Create flows in the IDE

> Create flow files and folders and write test code manually in the QA Wolf IDE.

If you'd prefer to have AI create and edit flows for you, see [Create flows with AI](/qawolf/Automate-flows-using-AI-2d35b2a994fb8084b524cfc9aca7c358).

## Create a folder or flow

Two entry points on the **Flows** tab create a flow in the IDE.

**From the flows list**

Click <Icon icon="square-plus" /> in the toolbar, then select **New flow** or **New folder**.

<Frame>
  <img src="https://mintcdn.com/qawolf-flows-tab-consolidation-outlining/dVzOgcihwGPt6kZs/images/flows-list-toolbar.png?fit=max&auto=format&n=dVzOgcihwGPt6kZs&q=85&s=39ceef8762e5f190ee6c81ba3fbf3c00" alt="The New flow and New folder menu in the flows list toolbar" width="754" height="410" data-path="images/flows-list-toolbar.png" />
</Frame>

**From the IDE**

<Steps>
  <Step>
    From the **Flows** tab, hover over the left sidebar to expand it, then click <Icon icon="code" /> **IDE**.

    <Frame>
      <img src="https://mintcdn.com/qawolf-flows-tab-consolidation-outlining/dVzOgcihwGPt6kZs/images/flows-sidebar.png?fit=max&auto=format&n=dVzOgcihwGPt6kZs&q=85&s=ae965ce7aa1398f75e417a948c675791" alt="The left sidebar with the IDE view selected" width="346" height="282" data-path="images/flows-sidebar.png" />
    </Frame>
  </Step>

  <Step>
    Navigate to the location in the file tree where you want to create the new file or folder.
  </Step>

  <Step>
    Click the <Icon icon="square-plus" /> icon in the toolbar.

    <Frame>
      <img src="https://mintcdn.com/qawolf-flows-tab-consolidation-outlining/0qgvvs_exWEOb91L/images/ide-add.png?fit=max&auto=format&n=0qgvvs_exWEOb91L&q=85&s=783d8239deb51642265c824b44df041c" alt="The IDE file explorer" width="600" height="500" data-path="images/ide-add.png" />
    </Frame>
  </Step>

  <Step>
    Click **New Folder** or **New Flow**.

    <Check>
      Use clear, descriptive names that reflect your app's feature areas — this helps both you and AI keep flows organized.
    </Check>
  </Step>
</Steps>

## Write test code

Select a flow file from the tree to open it in the code editor. The editor prefills new flows with [AAA](https://www.qawolf.com/blog/intro-to-aaa) (Arrange-Act-Assert) comments as a starting structure.

For a full explanation of flow structure and imports, see [Anatomy of a flow](/qawolf/anatomy-of-a-qa-wolf-test-mobile-edition).

<Note>
  QA Wolf lints your code as you type. See [Debug tests & flows](/qawolf/Debug-tests-and-flows-2c15b2a994fb805c9e92eec7a4a3e83e) if you encounter errors.
</Note>

## Publish your changes

<Steps>
  <Step>
    When ready, click **Review**.

    <Frame>
      <img src="https://mintcdn.com/qawolf-flows-tab-consolidation-outlining/hAbWXYwarMhM_SwC/images/unpublished.png?fit=max&auto=format&n=hAbWXYwarMhM_SwC&q=85&s=9823c198522250413ed086d714e045a0" alt="Unpublished" width="728" height="298" data-path="images/unpublished.png" />
    </Frame>
  </Step>

  <Step>
    Review your changes in the side-by-side diff.

    <Frame>
      <img src="https://mintcdn.com/qawolf-flows-tab-consolidation-outlining/Vr8yEXyPb0rB62tz/images/publish.png?fit=max&auto=format&n=Vr8yEXyPb0rB62tz&q=85&s=eaaeb0c5b8ad4e4dd5794346a20d3cec" alt="Publish" width="2282" height="506" data-path="images/publish.png" />
    </Frame>
  </Step>

  <Step>
    Enter a clear description of the change in the **Adding a comment** field.
  </Step>

  <Step>
    Click **Publish changes** to confirm. The publish dialog will close when your changes have been saved.
  </Step>
</Steps>
