Skip to content

Commit

Permalink
Jump to error code on badge click (#3262)
Browse files Browse the repository at this point in the history 
* add function to scroll to view

Signed-off-by: Jess Frazelle <[email protected]>

* scroll into view on click

Signed-off-by: Jess Frazelle <[email protected]>

* add test for jump to code with error

Signed-off-by: Jess Frazelle <[email protected]>

---------

Signed-off-by: Jess Frazelle <[email protected]>
  • Loading branch information
@jessfraz
jessfraz authored Aug 4, 2024
1 parent 21389c0 commit 9c87b12
Show file tree
Hide file tree
Showing 5 changed files with 483 additions and 120 deletions.
175 changes: 105 additions & 70 deletions e2e/playwright/flow-tests.spec.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,7 @@ import {
TEST_SETTINGS_ONBOARDING_EXPORT,
TEST_SETTINGS_ONBOARDING_START,
TEST_CODE_GIZMO,
TEST_CODE_LONG_WITH_ERROR_OUT_OF_VIEW,
TEST_SETTINGS_ONBOARDING_USER_MENU,
TEST_SETTINGS_ONBOARDING_PARAMETRIC_MODELING,
} from './storageStates'
Expand Down Expand Up @@ -8207,97 +8208,131 @@ const sketch002 = extrude(${[5, 5]} + 7, sketch002)`
await expect(page.locator('.cm-content')).toHaveText(result2.regExp)
})

test('Typing KCL errors induces a badge on the error logs pane button', async ({
page,
}) => {
const u = await getUtils(page)
test.describe('Code pane and errors', () => {
test('Typing KCL errors induces a badge on the code pane button', async ({
page,
}) => {
const u = await getUtils(page)

// Load the app with the working starter code
await page.addInitScript((code) => {
localStorage.setItem('persistCode', code)
}, bracket)
// Load the app with the working starter code
await page.addInitScript((code) => {
localStorage.setItem('persistCode', code)
}, bracket)

await page.setViewportSize({ width: 1200, height: 500 })
await u.waitForAuthSkipAppStart()
await page.setViewportSize({ width: 1200, height: 500 })
await u.waitForAuthSkipAppStart()

// wait for execution done
await u.openDebugPanel()
await u.expectCmdLog('[data-message-type="execution-done"]')
await u.closeDebugPanel()
// wait for execution done
await u.openDebugPanel()
await u.expectCmdLog('[data-message-type="execution-done"]')
await u.closeDebugPanel()

// Ensure no badge is present
const codePaneButton = page.getByRole('button', { name: 'KCL Code pane' })
await expect(codePaneButton).not.toContainText('notification')
// Ensure no badge is present
const codePaneButtonHolder = page.locator('#code-button-holder')
await expect(codePaneButtonHolder).not.toContainText('notification')

// Delete a character to break the KCL
await u.openKclCodePanel()
await page.getByText('extrude(').click()
await page.keyboard.press('Backspace')
// Delete a character to break the KCL
await u.openKclCodePanel()
await page.getByText('extrude(').click()
await page.keyboard.press('Backspace')

// Ensure that a badge appears on the button
await expect(codePaneButton).toContainText('notification')
})
// Ensure that a badge appears on the button
await expect(codePaneButtonHolder).toContainText('notification')
})

test('Opening and closing the code pane will consistently show error diagnostics', async ({
page,
}) => {
const u = await getUtils(page)
test('Opening and closing the code pane will consistently show error diagnostics', async ({
page,
}) => {
const u = await getUtils(page)

// Load the app with the working starter code
await page.addInitScript((code) => {
localStorage.setItem('persistCode', code)
}, bracket)
// Load the app with the working starter code
await page.addInitScript((code) => {
localStorage.setItem('persistCode', code)
}, bracket)

await page.setViewportSize({ width: 1200, height: 900 })
await u.waitForAuthSkipAppStart()
await page.setViewportSize({ width: 1200, height: 900 })
await u.waitForAuthSkipAppStart()

// wait for execution done
await u.openDebugPanel()
await u.expectCmdLog('[data-message-type="execution-done"]')
await u.closeDebugPanel()
// wait for execution done
await u.openDebugPanel()
await u.expectCmdLog('[data-message-type="execution-done"]')
await u.closeDebugPanel()

// Ensure we have no errors in the gutter.
await expect(page.locator('.cm-lint-marker-error')).not.toBeVisible()
// Ensure we have no errors in the gutter.
await expect(page.locator('.cm-lint-marker-error')).not.toBeVisible()

// Ensure no badge is present
const codePaneButton = page.getByRole('button', { name: 'KCL Code pane' })
await expect(codePaneButton).not.toContainText('notification')
// Ensure no badge is present
const codePaneButton = page.getByRole('button', { name: 'KCL Code pane' })
const codePaneButtonHolder = page.locator('#code-button-holder')
await expect(codePaneButtonHolder).not.toContainText('notification')

// Delete a character to break the KCL
await u.openKclCodePanel()
await page.getByText('extrude(').click()
await page.keyboard.press('Backspace')
// Delete a character to break the KCL
await u.openKclCodePanel()
await page.getByText('extrude(').click()
await page.keyboard.press('Backspace')

// Ensure that a badge appears on the button
await expect(codePaneButton).toContainText('notification')
// Ensure that a badge appears on the button
await expect(codePaneButtonHolder).toContainText('notification')

// Ensure we have an error diagnostic.
await expect(page.locator('.cm-lint-marker-error')).toBeVisible()
// Ensure we have an error diagnostic.
await expect(page.locator('.cm-lint-marker-error')).toBeVisible()

// error text on hover
await page.hover('.cm-lint-marker-error')
await expect(page.getByText('Unexpected token').first()).toBeVisible()
// error text on hover
await page.hover('.cm-lint-marker-error')
await expect(page.getByText('Unexpected token').first()).toBeVisible()

// Close the code pane
u.closeKclCodePanel()
// Close the code pane
codePaneButton.click()

await page.waitForTimeout(500)
await page.waitForTimeout(500)

// Ensure that a badge appears on the button
await expect(codePaneButtonHolder).toContainText('notification')
// Ensure we have no errors in the gutter.
await expect(page.locator('.cm-lint-marker-error')).not.toBeVisible()

// Open the code pane
u.openKclCodePanel()

// Ensure that a badge appears on the button
await expect(codePaneButtonHolder).toContainText('notification')

// Ensure we have an error diagnostic.
await expect(page.locator('.cm-lint-marker-error')).toBeVisible()

// Ensure that a badge appears on the button
await expect(codePaneButton).toContainText('notification')
// Ensure we have no errors in the gutter.
await expect(page.locator('.cm-lint-marker-error')).not.toBeVisible()
// error text on hover
await page.hover('.cm-lint-marker-error')
await expect(page.getByText('Unexpected token').first()).toBeVisible()
})

// Open the code pane
u.openKclCodePanel()
test('When error is not in view you can click the badge to scroll to it', async ({
page,
}) => {
const u = await getUtils(page)

// Ensure that a badge appears on the button
await expect(codePaneButton).toContainText('notification')
// Load the app with the working starter code
await page.addInitScript((code) => {
localStorage.setItem('persistCode', code)
}, TEST_CODE_LONG_WITH_ERROR_OUT_OF_VIEW)

// Ensure we have an error diagnostic.
await expect(page.locator('.cm-lint-marker-error')).toBeVisible()
await page.setViewportSize({ width: 1200, height: 500 })
await u.waitForAuthSkipAppStart()

await page.waitForTimeout(1000)

// error text on hover
await page.hover('.cm-lint-marker-error')
await expect(page.getByText('Unexpected token').first()).toBeVisible()
// Ensure badge is present
const codePaneButtonHolder = page.locator('#code-button-holder')
await expect(codePaneButtonHolder).toContainText('notification')

// Ensure we have no errors in the gutter, since error out of view.
await expect(page.locator('.cm-lint-marker-error')).not.toBeVisible()

// Click the badge.
const badge = page.locator('#code-badge')
await expect(badge).toBeVisible()
await badge.click()

// Ensure we have an error diagnostic.
await expect(page.locator('.cm-lint-marker-error')).toBeVisible()
})
})
Loading

0 comments on commit 9c87b12

Please sign in to comment.