0
0
mirror of https://github.com/PostHog/posthog.git synced 2024-11-24 18:07:17 +01:00
posthog/cypress/integration/trendsElements.js

124 lines
4.3 KiB
JavaScript
Raw Normal View History

Command palette (#1819) * add hotkey base * add platform check * Rename CommandBox to CommandPalette * Add styled-components * Restructure CommandPalette and add Esc handling * Update utils.js * add search box * Add logic types * Implement base logic * Fix scroll prevention * Update logic and add goto command base with Fuse fuzzy serach * ux hotkey * Implement command (de)registration * minor fix * base UI * error message & hints * command groups UI * Add commands search * Make commands work * Prepare palette for fuzzy search and add basic labeling * ui adjustments * ui * Improve colors * switch to global command * Optimize resolution * global go to commands * abstract item selection logic to command palette * Update casing and types * Add conditional useCommands * Improve results * keyboard nav * keyboard nav fix * removed double fuse (synonyms broken) * Update style * Fix highlighting * Remove extra style * conditional go to commands * add mouse hover handling and rename functions * remove mac check * add more commands * added insights stub pages * Add command components * refactor logic * Update styling * Remove extraneous `input` * load custom dashboards to command palette * Add input styling * Add write icon * Refactor results * minor adjustments * add person search * remove papercups fully * fix input indexing * fix result executing empty * Add command grouping and improve navigation * add urls * make logic explicit * fix error with hadnler * Remove redundant border-top * add trend functions * personal api key stub * Add command palette toggle button * Fix things * fix personal api keys * copy api key to clipboard * Add toggle text * Improve palette UX and perform refactoring * Improve UX and add palette usage reporting * tests refactor * filter person list * refactor api person tests * add squeak * deprecate by_distinct_id & by_email person endpoints * Optimize squeak * fix typegen error * use new filters in frontend * Optimize squeak * key identifier refactor * fix mypy * removed unused code * Make custom command UI more coherent * Add calculator to palette * Use equal sign * Make palette button nicer * Add lodash back officially and show palette suggestions lodash is still used in a few places, but it was not in package.json. The reason this was working was that lodash is a dependency of some other depedencies, but this was fragile. It's still not ideal to use this, but at least this is now not a hack the way it was. * Remove isHint * Optimize graph time range command * Move command results grouping to Kea logic * Fix result focus autoshift * Improve palette result focusing * Adjust for window.posthog being optional * add test for third-party person filters * Remove styled-components in favor of .scss files * Remove redundant container class * Use insect (sic!) squeak instead of pig squeak * Show only unique palette results * Fix palette overlay * Add powerful command building protocol CommandFlow * Fix minor issues * Always show scope when flow active * Use custom label icon * Add feedback sharing command * block command input from being captured in screen recording at least until we can figure out how to capture this info in a privacy-preserving way * Hide palette button on narrow screens * Improve responsiveness * Fix palette feedback sending * Fix Esc handling * Add Message Sent info * Fix Message Sent info * Fix dashboard creation and null name handling * Rename Cy tests to JS convention * Add basic Cypress test * Address feedback Co-authored-by: Eric <eeoneric@gmail.com> Co-authored-by: Paolo D'Amico <paolodamico@users.noreply.github.com>
2020-10-13 15:44:56 +02:00
describe('Trends actions & events', () => {
beforeEach(() => {
// given
cy.visit('/insights')
})
it('Insight History Panel Rendered', () => {
cy.get('[data-attr=insight-history-button]').click()
cy.get('[data-attr=insight-history-panel]').should('exist')
})
it('Add a pageview action filter', () => {
// when
cy.contains('Add action/event').click()
cy.get('[data-attr=trend-element-subject-1]').click()
cy.contains('Pageviews').click()
// then
cy.get('[data-attr=trend-line-graph]').should('exist')
})
it('DAU on 1 element', () => {
cy.get('[data-attr=math-selector-0]').click()
cy.get('[data-attr=math-dau-0]').click()
cy.get('[data-attr=trend-line-graph]').should('exist')
})
it('Show property select dynamically', () => {
cy.get('[data-attr=math-property-selector-0]').should('not.exist')
cy.get('[data-attr=math-selector-0]').click()
cy.get('[data-attr=math-avg-0]').click()
cy.get('[data-attr=math-property-selector-0]').should('exist')
})
it('Apply specific filter on default pageview event', () => {
cy.get('[data-attr=show-prop-filter-0]').click()
cy.get('[data-attr=new-prop-filter-0-\\$pageview-filter]').click()
cy.get('[data-attr=property-filter-dropdown]').click()
cy.get('[data-attr=prop-filter-event-1]').click()
cy.get('#rc_select_6').click()
cy.get('[data-attr=prop-val-0]').click()
cy.get('[data-attr=trend-line-graph]').should('exist')
})
it('Apply 1 overall filter', () => {
cy.get('[data-attr=new-prop-filter-trends-filters]').click()
cy.get('[data-attr=property-filter-dropdown]').click()
cy.get('[data-attr=prop-filter-event-1]').click()
cy.get('[data-attr=prop-val]').click()
cy.get('[data-attr=prop-val-0]').click()
cy.get('[data-attr=trend-line-graph]', { timeout: 8000 }).should('exist')
})
it('Apply interval filter', () => {
cy.get('[data-attr=interval-filter]').click()
cy.contains('Weekly').click()
cy.get('[data-attr=trend-line-graph]').should('exist')
})
it('Apply chart filter', () => {
cy.get('[data-attr=chart-filter]').click()
cy.contains('Pie').click()
cy.get('[data-attr=trend-pie-graph]').should('exist')
})
it('Apply table filter', () => {
cy.get('[data-attr=chart-filter]').click()
cy.contains('Table').click()
cy.get('[data-attr=trend-table-graph]').should('exist')
})
it('Apply date filter', () => {
cy.get('[data-attr=date-filter]').click()
cy.contains('Last 30 days').click()
cy.get('[data-attr=trend-line-graph]').should('exist')
})
it('Apply volume filter', () => {
cy.get('[data-attr=shownas-filter]').click()
cy.get('[data-attr=shownas-volume-option]').click()
cy.get('[data-attr=trend-line-graph]').should('exist')
})
it('Apply stickiness filter', () => {
cy.get('[data-attr=shownas-filter]').click()
cy.get('[data-attr=shownas-stickiness-option]').click()
cy.get('[data-attr=trend-line-graph]').should('exist')
})
it('Apply property breakdown', () => {
cy.get('[data-attr=add-breakdown-button]').click()
cy.get('[data-attr=prop-breakdown-select]').click()
cy.get('[data-attr=prop-breakdown-3]').click()
cy.get('[data-attr=trend-line-graph]').should('exist')
})
it('Apply all users cohort breakdown', () => {
cy.get('[data-attr=add-breakdown-button]').click()
cy.contains('Cohort').click()
cy.get('[data-attr=cohort-breakdown-select]').click()
cy.get('[data-attr=cohort-breakdown-all-users]').click()
cy.get('[data-attr=trend-line-graph]').should('exist')
})
it('Save to dashboard', () => {
cy.get('[data-attr=save-to-dashboard-button]').click()
cy.get('.ant-input').type('Pageviews')
cy.get('form > .ant-select > .ant-select-selector').click()
cy.get(':nth-child(1) > .ant-select-item-option-content').click()
cy.contains('Add panel to dashboard').click()
cy.wait(300) // not ideal but toast has a delay render
cy.get('[data-attr=success-toast]').should('exist')
})
})