diff --git a/ui/cypress/e2e/queryBuilder.test.ts b/ui/cypress/e2e/queryBuilder.test.ts
index 5f5513c50ab..78c18b28f2b 100644
--- a/ui/cypress/e2e/queryBuilder.test.ts
+++ b/ui/cypress/e2e/queryBuilder.test.ts
@@ -89,6 +89,44 @@ describe('The Query Builder', () => {
       cy.contains('Basic Ole Dashboard').should('exist')
     })
 
+    it('when it creates a query, the query has an aggregate window, clicking around aggregate window selections work', () => {
+      cy.get('@org').then((org: Organization) => {
+        cy.visit(`orgs/${org.id}/data-explorer`)
+      })
+
+      cy.contains('mem').click('right') // users sometimes click in random spots
+      cy.contains('active').click('bottomLeft')
+
+      cy.getByTestID('empty-graph--no-queries').should('exist')
+
+      cy.contains('Submit').click()
+
+      cy.get('.giraffe-plot').should('exist')
+
+      cy.getByTestID('switch-to-script-editor').click()
+
+      cy.contains(
+        '|> aggregateWindow(every: v.windowPeriod, fn: mean, createEmpty: true)'
+      ).should('exist')
+
+      cy.getByTestID('switch-to-query-builder').click()
+      cy.getByTestID('custom-window-period').click()
+
+      cy.getByTestID('custom-window-period').click()
+      cy.getByTestID('duration-input--error').should('not.exist')
+      cy.getByTestID('duration-input').type('not a duration')
+      cy.getByTestID('duration-input--error').should('exist')
+
+      cy.getByTestID('auto-window-period').click()
+
+      cy.getByTestID('duration-input--error').should('not.exist')
+      cy.getByTestID('toggle').click()
+      cy.getByTestID('switch-to-script-editor').click()
+      cy.contains(
+        '|> aggregateWindow(every: v.windowPeriod, fn: mean, createEmpty: false)'
+      ).should('exist')
+    })
+
     it('can create a bucket from the buckets list', () => {
       cy.get('@org').then((org: Organization) => {
         cy.visit(`orgs/${org.id}/data-explorer`)
diff --git a/ui/src/timeMachine/components/WindowPeriod.tsx b/ui/src/timeMachine/components/WindowPeriod.tsx
index a722e60da25..2a847211ffe 100644
--- a/ui/src/timeMachine/components/WindowPeriod.tsx
+++ b/ui/src/timeMachine/components/WindowPeriod.tsx
@@ -9,6 +9,7 @@ import {
   ComponentStatus,
   ComponentSize,
 } from '@influxdata/clockface'
+import DurationInput from 'src/shared/components/DurationInput'
 
 // Actions
 import {
@@ -24,12 +25,13 @@ import {
 } from 'src/timeMachine/selectors'
 
 // Constants
-import {DURATIONS} from 'src/timeMachine/constants/queryBuilder'
+import {
+  DURATIONS,
+  AGG_WINDOW_AUTO,
+} from 'src/timeMachine/constants/queryBuilder'
 
 // Types
 import {AppState} from 'src/types'
-import DurationInput from 'src/shared/components/DurationInput'
-import {AGG_WINDOW_AUTO} from '../constants/queryBuilder'
 
 type ReduxProps = ConnectedProps<typeof connector>
 type Props = ReduxProps
@@ -76,6 +78,7 @@ const WindowPeriod: FunctionComponent<Props> = ({
         <SelectGroup.Option
           name="custom"
           id="custom-window-period"
+          testID="custom-window-period"
           active={!isAutoWindowPeriod}
           value="custom"
           onClick={onSetWindowPeriodSelectionMode}
@@ -86,6 +89,7 @@ const WindowPeriod: FunctionComponent<Props> = ({
         <SelectGroup.Option
           name="auto"
           id="auto-window-period"
+          testID="auto-window-period"
           active={isAutoWindowPeriod}
           value="auto"
           onClick={onSetWindowPeriodSelectionMode}