Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

docs: remove svelte 3 references and update migration guide #5999

Merged
merged 1 commit into from
Nov 12, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions docs/app/component-testing/get-started.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -47,8 +47,8 @@ following development servers and frameworks:
| [Vue with Vite](/app/component-testing/vue/overview#Vue-with-Vite) | Vue 3 | Vite 4-5 |
| [Vue with Webpack](/app/component-testing/vue/overview#Vue-with-Webpack) | Vue 3 | Webpack 4-5 |
| [Angular](/app/component-testing/angular/overview#Framework-Configuration) | Angular 17-18 | Webpack 5 |
| [Svelte with Vite](/app/component-testing/svelte/overview#Svelte-with-Vite) <Badge type="info">Alpha</Badge> | Svelte 3-4 | Vite 4-5 |
| [Svelte with Webpack](/app/component-testing/svelte/overview#Svelte-with-Webpack) <Badge type="info">Alpha</Badge> | Svelte 3-4 | Webpack 4-5 |
| [Svelte with Vite](/app/component-testing/svelte/overview#Svelte-with-Vite) <Badge type="info">Alpha</Badge> | Svelte 4 | Vite 4-5 |
| [Svelte with Webpack](/app/component-testing/svelte/overview#Svelte-with-Webpack) <Badge type="info">Alpha</Badge> | Svelte 4 | Webpack 4-5 |

The following integrations are built and maintained by Cypress community members.

Expand Down
8 changes: 4 additions & 4 deletions docs/app/component-testing/svelte/overview.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ sidebar_label: Overview

## Framework Support

Cypress Component Testing supports Svelte 3+ in a variety of different
Cypress Component Testing supports Svelte 4 in a variety of different
frameworks:

- [Svelte with Vite](#Svelte-with-Vite)
Expand Down Expand Up @@ -71,7 +71,7 @@ properly. The examples below are for reference purposes.

### Svelte with Vite

Cypress Component Testing works with Svelte apps that use Vite 2+ as the
Cypress Component Testing works with Svelte apps that use Vite 4+ as the
bundler.

#### Vite Configuration
Expand All @@ -93,7 +93,7 @@ bundler.

#### Svelte Vite Sample Apps

- [Svelte 3 Vite 3 with Typescript](https://github.com/cypress-io/cypress-component-testing-apps/tree/main/svelte-vite-ts)
- [Svelte 4 Vite 5 with Typescript](https://github.com/cypress-io/cypress-component-testing-apps/tree/main/svelte-vite-ts)

### Svelte with Webpack

Expand Down Expand Up @@ -129,4 +129,4 @@ in manually via the `webpackConfig` option.

#### Svelte Webpack Sample Apps

- [Svelte 3 Webpack 5 with Typescript](https://github.com/cypress-io/cypress-component-testing-apps/tree/main/svelte-webpack-ts)
- [Svelte 4 Webpack 5 with Typescript](https://github.com/cypress-io/cypress-component-testing-apps/tree/main/svelte-webpack-ts)
35 changes: 35 additions & 0 deletions docs/app/references/migration-guide.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -172,6 +172,41 @@ module.exports = defineConfig({
})
```

### Svelte 3 for Component Testing is no longer supported

With Cypress 14, Cypress no longer ships the Svelte 3 component testing harness with the Cypress binary.

However, if you have not been able to upgrade Svelte and still need the Cypress Svelte 3 test harness, it can be installed independently via version 2.x.x of the [@cypress/svelte](https://www.npmjs.com/package/@cypress/svelte) package.

```sh
npm install --save-dev @cypress/svelte@2
```

Note that this version of the test harness is deprecated and no longer actively supported by Cypress and is intended to serve as a temporary work around until you are able to migrate your project to Svelte 4+. The Cypress launchpad will also warn against Component testing mismatched dependencies, but this will not stop you from running your component tests.

To update, inside your support file (ex: `./cypress/support/component.(js|ts)`) or wherever your mount function is imported, change

```ts
import { mount } from `cypress/svelte`
```

to

```ts
import { mount } from `@cypress/svelte`
```

Your code should now look like this:

```ts
import MySvelteComponent from './MySvelteComponent'
import { mount } from `@cypress/svelte`

it('renders', () => {
cy.mount(MySvelteComponent)
})
```

## Migrating to Cypress 13.0

This guide details the changes and how to change your code to migrate to Cypress
Expand Down