Skip to content

Commit

Permalink
feat: add v13 splash page content (wip)
Browse files Browse the repository at this point in the history
  • Loading branch information
@AtofStryker
AtofStryker committed Aug 14, 2023
1 parent fff7490 commit a59b58f
Show file tree
Hide file tree
Showing 3 changed files with 59 additions and 54 deletions.
24 changes: 11 additions & 13 deletions packages/launchpad/src/migration/MajorVersionWelcome.cy.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,16 +13,12 @@ describe('<MajorVersionWelcome />', { viewportWidth: 1280, viewportHeight: 1400
cy.contains('h1', 'What\'s New in Cypress').should('be.visible')

cy.get('[data-cy="release-highlights"]').within(() => {
cy.contains('a[href="https://on.cypress.io/changelog#12-0-0"]', '12.0.0')
cy.contains('a[href="https://on.cypress.io/changelog#12-0-0"]', 'changelog')
cy.contains('a[href="https://on.cypress.io/migration-guide#Migrating-to-Cypress-12-0"]', 'Migration Guide')

cy.contains('a[href="https://on.cypress.io/origin"]', 'cy.origin()')
cy.contains('a[href="https://on.cypress.io/session"]', 'cy.session()')
cy.contains('a[href="https://on.cypress.io/retry-ability"]', 'Retry-ability Guide')
cy.contains('a[href="https://on.cypress.io/changelog?utm_source=splash-page&utm_campaign=v13#13-0-0"]', '13.0.0')
cy.contains('a[href="https://on.cypress.io/changelog?utm_source=splash-page&utm_campaign=v13#13-0-0"]', 'changelog')
})

cy.get('[data-cy="previous-release-highlights"]').within(() => {
cy.contains('a[href="https://on.cypress.io/changelog#12-0-0"]', '12.0.0')
cy.contains('a[href="https://on.cypress.io/changelog#11-0-0"]', '11.0.0')
cy.contains('a[href="https://on.cypress.io/changelog#10-0-0"]', '10.0.0')
})
Expand All @@ -37,15 +33,17 @@ describe('<MajorVersionWelcome />', { viewportWidth: 1280, viewportHeight: 1400
})

it('renders correct time for releases and overflows correctly', () => {
cy.clock(Date.UTC(2022, 10, 8))
cy.clock(Date.UTC(2023, 7, 23))
cy.mount(<MajorVersionWelcome />)
cy.contains('11.0.0 Released just now')
cy.contains('10.0.0 Released 5 months ago')
cy.contains('13.0.0 Released just now')
cy.contains('12.0.0 Released 9 months ago')
cy.contains('11.0.0 Released 10 months ago')
cy.contains('10.0.0 Released last year')
cy.tick(interval('1 minute'))
cy.contains('11.0.0 Released 1 minute ago')
cy.contains('13.0.0 Released 1 minute ago')
cy.tick(interval('1 month'))
cy.contains('11.0.0 Released last month')
cy.contains('10.0.0 Released 6 months ago')
cy.contains('13.0.0 Released last month')
cy.contains('12.0.0 Released 10 months ago')

cy.viewport(1280, 500)

Expand Down
87 changes: 47 additions & 40 deletions packages/launchpad/src/migration/MajorVersionWelcome.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -32,76 +32,57 @@
</h1>
<div class="mb-[16px]">
<ExternalLink
href="https://on.cypress.io/changelog#12-0-0"
href="https://on.cypress.io/changelog?utm_source=splash-page&utm_campaign=v13#13-0-0"
class="font-bold text-indigo-500"
>
12.0.0
13.0.0
</ExternalLink>
<span class="font-light pl-[10px] text-gray-500 text-[14px]">
Released {{ versionReleaseDates['12'] }}
Released {{ versionReleaseDates['13'] }}
</span>
</div>
<div class="children:mb-[16px]">
<p>
For a complete list of updates and breaking changes in v12.0.0, please review our
<ExternalLink href="https://on.cypress.io/changelog#12-0-0">
For a complete list of updates and breaking changes in v13.0.0, please review our
<ExternalLink href="https://on.cypress.io/changelog?utm_source=splash-page&utm_campaign=v13#13-0-0">
<!--eslint-disable-next-line vue/multiline-html-element-content-newline-->
changelog</ExternalLink>.
</p>

<!-- EMBEDDED VIDEO PLACEHOLDER -->

<h2 class="font-bold text-[18px] text-jade-1000">
Testing Multi-Origin Workflows
Test Replay
</h2>

<p>
Cypress now has full support for testing multiple origins in a single test with the <ExternalLink href="https://on.cypress.io/origin">
<code>cy.origin()</code>
</ExternalLink> command! To take a deep-dive into how this works, read our

<ExternalLink href="https://on.cypress.io/cy-origin-journey">
<!--eslint-disable-next-line vue/multiline-html-element-content-newline-->
blog post</ExternalLink>.
Test Replay brings the debugging experience you know and love from the Cypress app directly into your recorded tests in Cypress Cloud. Inspect the DOM, network events, and console logs of your application from your tests exactly as they ran in CI.
</p>

<h2 class="font-bold mt-[24px] mb-[16px] text-[18px] text-jade-1000">
Test Isolation
</h2>

<!-- TODO: Do we need an onlink for this? -->
<p>
Cypress now ensures each test runs in a clean browser context by default. We now clear the page, <code>cookies</code>, <code>localStorage</code>, and <code>sessionStorage</code> before each test to guide developers towards writing independent tests from the start.
Test Replay is available for all Cypress Cloud plans for Chromium-based browsers. Learn more in our <ExternalLink href="https://docs.cypress.io/guides/cloud/debugging/test-replay?utm_source=splash-page&utm_campaign=v13">
documentation
</ExternalLink>.
</p>
<p>
If your existing tests relied on a previous test to run successfully, you might need to make some modifications to your test suite. See the

<ExternalLink href="https://on.cypress.io/migration-guide#Migrating-to-Cypress-12-0">
Migration Guide
</ExternalLink>

for more details on what you can expect.
<p>
To start using Test Replay, simply record a run to Cypress Cloud. Once recorded, click the "Test Replay" icon beside any test in the Cypress Cloud to see a live replay of the recorded run.
</p>

<h2 class="font-bold mt-[24px] mb-[16px] text-[18px] text-jade-1000">
We Now Store The Browser Context, So You Don’t Have To
Changes to video defaults
</h2>

<p>
The <ExternalLink href="https://on.cypress.io/session">
<code>cy.session()</code>
</ExternalLink> command complements test isolation by providing a way to save and share browser contexts between tests and specs in a single run on the same machine.
<code>video</code> and <code>videoCompression</code> are now set to <code>false</code> by default. Recording and compressing videos can be resource intensive, sometimes impacting the speed that tests run in CI. Test Replay also serves as a replacement for debugging via video for many of our Cloud users. We’ve changed these video options to be opt-in so you can configure recording video based on your needs.
</p>

<h2 class="font-bold mt-[24px] mb-[16px] text-[18px] text-jade-1000">
Detaching Ourselves From Detached Dom Errors
</h2>

<!-- TODO: Do we need an onlink for this? -->
<p>
We have made enhancements to how Cypress manages DOM element resolution to reduce the likelihood of hitting the dreaded detached DOM errors due to maintaining stale DOM references. We've updated our

<ExternalLink href="https://on.cypress.io/retry-ability">
Retry-ability Guide
</ExternalLink>

with all the details if you'd like to learn more.
The <code>shouldUploadVideoOnPass</code> option is no longer available. This option was mostly used to skip video compression for unused videos which is now skipped by default. If you want to control which videos are saved locally or uploaded to Cypress Cloud, see our <ExternalLink href="https://docs.cypress.io/guides/guides/screenshots-and-videos#Delete-videos-for-specs-without-failing-or-retried-tests?utm_source=splash-page&utm_campaign=v13">
documentation
</ExternalLink> for our recommended workaround.
</p>
</div>
</div>
Expand All @@ -113,6 +94,31 @@
<h2 class="font-bold mt-[24px] mb-[12px] text-[14px] text-gray-600">
Previous release highlights
</h2>
<div class="pb-[8px]">
<ExternalLink
href="https://on.cypress.io/changelog#12-0-0"
class="font-bold text-indigo-500"
>
12.0.0
</ExternalLink>
<span class="font-light pl-[10px] text-gray-500 text-[14px]">
Released {{ versionReleaseDates['12'] }}
</span>
</div>
<p class="text-[14px] leading-[20px]">
We made <ExternalLink href="https://on.cypress.io/origin">
<code>cy.origin()</code>
</ExternalLink>, <ExternalLink href="https://on.cypress.io/session">
<code>cy.session()</code>
</ExternalLink>, and test isolation generally available to allow users to test multiple origin workflows while allowing users to rehydrate test state in a consistent manner.
<br>
<br>
Read about the v12.0.0 changes in our
<ExternalLink href="https://on.cypress.io/cypress-12-release">
<!--eslint-disable-next-line vue/multiline-html-element-content-newline-->
blog post</ExternalLink>.
</p>
<br>
<div class="pb-[8px]">
<ExternalLink
href="https://on.cypress.io/changelog#11-0-0"
Expand Down Expand Up @@ -212,6 +218,7 @@ const versionReleaseDates = computed(() => {
'10': useTimeAgo(Date.UTC(2022, 5, 1)).value,
'11': useTimeAgo(Date.UTC(2022, 10, 8)).value,
'12': useTimeAgo(Date.UTC(2022, 11, 6)).value,
'13': useTimeAgo(Date.UTC(2023, 7, 23)).value,
}
})

Expand Down
2 changes: 1 addition & 1 deletion packages/types/src/constants.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@ export const PACKAGE_MANAGERS = ['npm', 'yarn', 'pnpm'] as const

// Note: ONLY change this in code that will be merged into a release branch
// for a new major version of Cypress
export const MAJOR_VERSION_FOR_CONTENT = '12'
export const MAJOR_VERSION_FOR_CONTENT = '13'

export const RUN_ALL_SPECS_KEY = '__all' as const

Expand Down

0 comments on commit a59b58f

Please sign in to comment.