diff --git a/.eslintignore b/.eslintignore index bfe7b1fa95..d123c10530 100644 --- a/.eslintignore +++ b/.eslintignore @@ -2,7 +2,9 @@ **/expected.js _output test/*/samples/*/output.js -node_modules + +# automatically generated +internal_exports.ts # output files animate/*.js diff --git a/.eslintrc.js b/.eslintrc.js index 946a157e40..a093de610b 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -1,65 +1,6 @@ module.exports = { root: true, - rules: { - indent: 'off', - 'no-unused-vars': 'off', - semi: [2, 'always'], - 'keyword-spacing': [2, { before: true, after: true }], - 'space-before-blocks': [2, 'always'], - 'no-mixed-spaces-and-tabs': [2, 'smart-tabs'], - 'no-cond-assign': 0, - 'object-shorthand': [2, 'always'], - 'no-const-assign': 2, - 'no-class-assign': 2, - 'no-this-before-super': 2, - 'no-var': 2, - 'no-unreachable': 2, - 'valid-typeof': 2, - 'quote-props': [2, 'as-needed'], - 'one-var': [2, 'never'], - 'prefer-arrow-callback': 2, - 'prefer-const': [2, { destructuring: 'all' }], - 'arrow-spacing': 2, - 'no-inner-declarations': 0, - 'require-atomic-updates': 'off', - '@typescript-eslint/indent': 'off', - '@typescript-eslint/camelcase': 'off', - '@typescript-eslint/no-use-before-define': 'off', - '@typescript-eslint/array-type': ['error', 'array-simple'], - '@typescript-eslint/explicit-function-return-type': 'off', - '@typescript-eslint/no-explicit-any': 'off', - '@typescript-eslint/explicit-member-accessibility': 'off', - '@typescript-eslint/no-unused-vars': [ - 'error', - { - argsIgnorePattern: '^_' - } - ], - '@typescript-eslint/no-object-literal-type-assertion': 'off', - '@typescript-eslint/no-unused-vars': 'off', - '@typescript-eslint/prefer-interface': 'off' - }, - globals: { - globalThis: false - }, - env: { - es6: true, - browser: true, - node: true, - mocha: true - }, - extends: [ - 'eslint:recommended', - 'plugin:import/errors', - 'plugin:import/warnings', - 'plugin:import/typescript', - 'plugin:@typescript-eslint/recommended' - ], - parserOptions: { - ecmaVersion: 9, - sourceType: 'module' - }, - plugins: ['svelte3'], + extends: '@sveltejs', settings: { 'import/core-modules': [ 'svelte', @@ -69,20 +10,5 @@ module.exports = { 'estree' ], 'svelte3/compiler': require('./compiler') - }, - overrides: [ - { - files: ['*.js'], - rules: { - '@typescript-eslint/no-var-requires': 'off' - } - }, - { - files: ['*.svelte'], - processor: 'svelte3/svelte3', - rules: { - '@typescript-eslint/indent': 'off' - } - } - ] + } }; diff --git a/.github/ISSUE_TEMPLATE.md b/.github/ISSUE_TEMPLATE.md index 6871094f5c..7daff3f1ab 100644 --- a/.github/ISSUE_TEMPLATE.md +++ b/.github/ISSUE_TEMPLATE.md @@ -8,10 +8,13 @@ the issue. One way we prioritize issues is by the number of :+1: reactions on their descriptions. Please DO NOT add `+1` or :+1: comments. ### Feature requests and proposals + We're excited to hear how we can make Svelte better. Please add as much detail -as you can on your use case. +as you can on your use case. To propose an implementation of a large feature or +change, please create an [RFC](https://github.com/sveltejs/rfcs). ### Bugs + If you're filing an issue about a bug please include as much information as you can including the following. diff --git a/.github/ISSUE_TEMPLATE/feature_request.md b/.github/ISSUE_TEMPLATE/feature_request.md index e533c21c96..923bfdb50c 100644 --- a/.github/ISSUE_TEMPLATE/feature_request.md +++ b/.github/ISSUE_TEMPLATE/feature_request.md @@ -7,6 +7,11 @@ assignees: '' --- + + **Is your feature request related to a problem? Please describe.** A clear and concise description of what the problem is. For example: I'm always frustrated when [...] diff --git a/.github/PULL_REQUEST_TEMPLATE.md b/.github/PULL_REQUEST_TEMPLATE.md index 1e77e0337a..d14a0f9fe4 100644 --- a/.github/PULL_REQUEST_TEMPLATE.md +++ b/.github/PULL_REQUEST_TEMPLATE.md @@ -1,8 +1,7 @@ - - ### Before submitting the PR, please make sure you do the following -- [ ] It's really useful if your PR relates to an outstanding issue, so please reference it in your PR, or create an explanatory one for discussion. In many cases features are absent for a reason. -- [ ] This message body should clearly illustrate what problems it solves. If there are related issues, remember to reference them. -- [ ] Ideally, include a test that fails without this PR but passes with it. PRs will only be merged once they pass CI. (Remember to `npm run lint`!) +- [ ] It's really useful if your PR references an issue where it is discussed ahead of time. In many cases, features are absent for a reason. For large changes, please create an RFC: https://github.com/sveltejs/rfcs +- [ ] This message body should clearly illustrate what problems it solves. +- [ ] Ideally, include a test that fails without this PR but passes with it. + ### Tests -- [ ] Run the tests tests with `npm test` or `yarn test`) +- [ ] Run the tests with `npm test` and lint the project with `npm run lint` diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml index 2488902b24..4e04386fcc 100644 --- a/.github/workflows/ci.yml +++ b/.github/workflows/ci.yml @@ -3,12 +3,12 @@ on: [push, pull_request] jobs: Tests: runs-on: ${{ matrix.os }} + timeout-minutes: 10 strategy: matrix: - node-version: [8, 10, 12] + node-version: [8, 10, 12, 14] os: [ubuntu-latest, windows-latest, macOS-latest] steps: - - run: git config --global core.autocrlf false - uses: actions/checkout@v1 - uses: actions/setup-node@v1 with: @@ -19,7 +19,18 @@ jobs: CI: true Lint: runs-on: ubuntu-latest + timeout-minutes: 2 steps: - uses: actions/checkout@v1 - uses: actions/setup-node@v1 - run: 'npm i && npm run lint' + Unit: + runs-on: ${{ matrix.os }} + timeout-minutes: 5 + strategy: + matrix: + os: [ubuntu-latest, windows-latest, macOS-latest] + steps: + - uses: actions/checkout@v1 + - uses: actions/setup-node@v1 + - run: 'npm i && npm run test:unit' diff --git a/.gitignore b/.gitignore index 7a14244929..f7fac04eba 100644 --- a/.gitignore +++ b/.gitignore @@ -1,6 +1,7 @@ .idea .DS_Store .nyc_output +.vscode node_modules *.map /src/compiler/compile/internal_exports.ts diff --git a/.mocharc.js b/.mocharc.js new file mode 100644 index 0000000000..e55f26099e --- /dev/null +++ b/.mocharc.js @@ -0,0 +1,14 @@ +module.exports = { + file: [ + 'test/test.ts' + ], + require: [ + 'sucrase/register' + ] +}; + +// add coverage options when running 'npx c8 mocha' +if (process.env.NODE_V8_COVERAGE) { + module.exports.fullTrace = true; + module.exports.require.push('source-map-support/register'); +} diff --git a/.prettierrc b/.prettierrc deleted file mode 100644 index 81451039fa..0000000000 --- a/.prettierrc +++ /dev/null @@ -1,3 +0,0 @@ -useTabs: true -singleQuote: true -trailingComma: es5 diff --git a/CHANGELOG.md b/CHANGELOG.md index 9b2c8f5b07..106d091cee 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -2,8 +2,231 @@ ## Unreleased +* Add `EventSource` to known globals ([#5463](https://github.com/sveltejs/svelte/issues/5463)) +* Fix compiler exception with `~`/`+` combinators and `{...spread}` attributes ([#5465](https://github.com/sveltejs/svelte/issues/5465)) + +## 3.28.0 + +* Add `{#key}` block for keying arbitrary content on an expression ([#1469](https://github.com/sveltejs/svelte/issues/1469)) + +## 3.27.0 + +* Add `|nonpassive` event modifier, explicitly passing `passive: false` ([#2068](https://github.com/sveltejs/svelte/issues/2068)) +* Scope CSS selectors with `~` and `+` combinators ([#3104](https://github.com/sveltejs/svelte/issues/3104)) +* Fix keyed `{#each}` not reacting to key changing ([#5444](https://github.com/sveltejs/svelte/issues/5444)) +* Fix destructuring into store values ([#5449](https://github.com/sveltejs/svelte/issues/5449)) +* Fix erroneous `missing-declaration` warning with `use:obj.method` ([#5451](https://github.com/sveltejs/svelte/issues/5451)) + +## 3.26.0 + +* Support `use:obj.method` as actions ([#3935](https://github.com/sveltejs/svelte/issues/3935)) +* Support `_` as numeric separator ([#5407](https://github.com/sveltejs/svelte/issues/5407)) +* Fix assignments to properties on store values ([#5412](https://github.com/sveltejs/svelte/issues/5412)) +* Add special style scoping handling of `[open]` selectors on `
` elements ([#5421](https://github.com/sveltejs/svelte/issues/5421)) +* Support `import.meta` in template expressions ([#5422](https://github.com/sveltejs/svelte/issues/5422)) + +## 3.25.1 + +* Fix specificity of certain styles involving a child selector ([#4795](https://github.com/sveltejs/svelte/issues/4795)) +* Fix transitions that are parameterised with stores ([#5244](https://github.com/sveltejs/svelte/issues/5244)) +* Fix scoping of styles involving child selector and `*` ([#5370](https://github.com/sveltejs/svelte/issues/5370)) +* Fix destructuring which reassigns stores ([#5388](https://github.com/sveltejs/svelte/issues/5388)) +* Fix `{#await}`s with no `{:catch}` getting stuck unresolved if the promise rejects ([#5401](https://github.com/sveltejs/svelte/issues/5401)) + +## 3.25.0 + +* Use `null` rather than `undefined` for coerced bound value of `` ([#1701](https://github.com/sveltejs/svelte/issues/1701)) +* Expose object of which slots have received content in `$$slots` ([#2106](https://github.com/sveltejs/svelte/issues/2106)) +* Correctly disallow using lifecycle hooks after synchronous component initialisation ([#4259](https://github.com/sveltejs/svelte/issues/4259), [#4899](https://github.com/sveltejs/svelte/issues/4899)) +* Re-throw an unhandled rejection when an `{#await}` block with no `{:catch}` gets a rejection ([#5129](https://github.com/sveltejs/svelte/issues/5129)) +* Add types to `createEventDispatcher` ([#5211](https://github.com/sveltejs/svelte/issues/5211)) +* In SSR mode, do not automatically declare variables for reactive assignments to member expressions ([#5247](https://github.com/sveltejs/svelte/issues/5247)) +* Include selector in message of `unused-css-selector` warning ([#5252](https://github.com/sveltejs/svelte/issues/5252)) +* Fix using ``s in child `{#await}`/`{#each}` contexts ([#5255](https://github.com/sveltejs/svelte/issues/5255)) +* Fix using `` in `{:catch}` ([#5259](https://github.com/sveltejs/svelte/issues/5259)) +* Fix setting one-way bound `` `value` to `undefined` when it has spread attributes ([#5270](https://github.com/sveltejs/svelte/issues/5270)) +* Fix deep two-way bindings inside an `{#each}` involving a store ([#5286](https://github.com/sveltejs/svelte/issues/5286)) +* Use valid XHTML for elements that are optimised and inserted with `.innerHTML` ([#5315](https://github.com/sveltejs/svelte/issues/5315)) +* Fix reactivity of `$$props` in slot fallback content ([#5367](https://github.com/sveltejs/svelte/issues/5367)) + +## 3.24.1 + +* Prevent duplicate invalidation with certain two-way component bindings ([#3180](https://github.com/sveltejs/svelte/issues/3180), [#5117](https://github.com/sveltejs/svelte/issues/5117), [#5144](https://github.com/sveltejs/svelte/issues/5144)) +* Fix reactivity when passing `$$props` to a `` ([#3364](https://github.com/sveltejs/svelte/issues/3364)) +* Fix transitions on `{#each}` `{:else}` ([#4970](https://github.com/sveltejs/svelte/issues/4970)) +* Fix unneeded invalidation of `$$props` and `$$restProps` ([#4993](https://github.com/sveltejs/svelte/issues/4993), [#5118](https://github.com/sveltejs/svelte/issues/5118)) +* Provide better compiler error message when mismatched tags are due to autoclosing of tags ([#5049](https://github.com/sveltejs/svelte/issues/5049)) +* Add `a11y-label-has-associated-control` warning ([#5074](https://github.com/sveltejs/svelte/pull/5074)) +* Add `a11y-media-has-caption` warning ([#5075](https://github.com/sveltejs/svelte/pull/5075)) +* Fix `bind:group` when using contextual reference ([#5174](https://github.com/sveltejs/svelte/issues/5174)) + +## 3.24.0 + +* Support nullish coalescing (`??`) and optional chaining (`?.`) operators ([#1972](https://github.com/sveltejs/svelte/issues/1972)) +* Support `import.meta` ([#4379](https://github.com/sveltejs/svelte/issues/4379)) +* Fix only setting `` values when they're changed when there are spread attributes ([#4418](https://github.com/sveltejs/svelte/issues/4418)) +* Fix placement of `{@html}` when used at the root of a slot, at the root of a component, or in `` ([#5012](https://github.com/sveltejs/svelte/issues/5012), [#5071](https://github.com/sveltejs/svelte/pull/5071)) +* Fix certain handling of two-way bound `contenteditable` elements ([#5018](https://github.com/sveltejs/svelte/issues/5018)) +* Fix handling of `import`ed value that is used as a store and is also mutated ([#5019](https://github.com/sveltejs/svelte/issues/5019)) +* Do not display `a11y-missing-content` warning on elements with `contenteditable` bindings ([#5020](https://github.com/sveltejs/svelte/issues/5020)) +* Fix handling of `this` in inline function expressions in the template ([#5033](https://github.com/sveltejs/svelte/issues/5033)) +* Fix collapsing HTML with static content ([#5040](https://github.com/sveltejs/svelte/issues/5040)) +* Prevent use of `$store` at compile time when top-level `store` has been shadowed ([#5048](https://github.com/sveltejs/svelte/issues/5048)) +* Update ` ``` @@ -44,7 +44,7 @@ As in HTML, values may be unquoted. Attribute values can contain JavaScript expressions. -```html +```sv page {p} ``` @@ -52,15 +52,26 @@ Attribute values can contain JavaScript expressions. Or they can *be* JavaScript expressions. -```html +```sv ``` --- -An expression might include characters that would cause syntax highlighting to fail in regular HTML, so quoting the value is permitted. The quotes do not affect how the value is parsed: +Boolean attributes are included on the element if their value is [truthy](https://developer.mozilla.org/en-US/docs/Glossary/Truthy) and excluded if it's [falsy](https://developer.mozilla.org/en-US/docs/Glossary/Falsy). + +All other attributes are included unless their value is [nullish](https://developer.mozilla.org/en-US/docs/Glossary/Nullish) (`null` or `undefined`). ```html + +
This div has no title attribute
+``` + +--- + +An expression might include characters that would cause syntax highlighting to fail in regular HTML, so quoting the value is permitted. The quotes do not affect how the value is parsed: + +```sv ``` @@ -68,7 +79,7 @@ An expression might include characters that would cause syntax highlighting to f When the attribute name and value match (`name={name}`), they can be replaced with `{name}`. -```html +```sv @@ -80,7 +91,7 @@ By convention, values passed to components are referred to as *properties* or *p As with elements, `name={name}` can be replaced with the `{name}` shorthand. -```html +```sv ``` @@ -90,18 +101,30 @@ As with elements, `name={name}` can be replaced with the `{name}` shorthand. An element or component can have multiple spread attributes, interspersed with regular ones. -```html +```sv ``` --- -*`$$props`* references all props that are passed to a component – including ones that are not declared with `export`. It is useful in rare cases, but not generally recommended, as it is difficult for Svelte to optimise. +*`$$props`* references all props that are passed to a component, including ones that are not declared with `export`. It is not generally recommended, as it is difficult for Svelte to optimise. But it can be useful in rare cases – for example, when you don't know at compile time what props might be passed to a component. -```html +```sv ``` +--- + +*`$$restProps`* contains only the props which are *not* declared with `export`. It can be used to pass down other unknown attributes to an element in a component. It shares the same optimisation problems as *`$$props`*, and is likewise not recommended. + +```html + +``` + + +> The `value` attribute of an `input` element or its children `option` elements must not be set with spread attributes when using `bind:group` or `bind:checked`. Svelte needs to be able to see the element's `value` directly in the markup in these cases so that it can link it to the bound variable. + +--- ### Text expressions @@ -113,7 +136,7 @@ An element or component can have multiple spread attributes, interspersed with r Text can also contain JavaScript expressions: -```html +```sv

Hello {name}!

{a} + {b} = {a + b}.

``` @@ -125,7 +148,7 @@ Text can also contain JavaScript expressions: You can use HTML comments inside components. -```html +```sv

Hello world

``` @@ -134,7 +157,7 @@ You can use HTML comments inside components. Comments beginning with `svelte-ignore` disable warnings for the next block of markup. Usually these are accessibility warnings; make sure that you're disabling them for a good reason. -```html +```sv ``` @@ -156,7 +179,7 @@ Comments beginning with `svelte-ignore` disable warnings for the next block of m Content that is conditionally rendered can be wrapped in an if block. -```html +```sv {#if answer === 42}

what was the question?

{/if} @@ -166,7 +189,7 @@ Content that is conditionally rendered can be wrapped in an if block. Additional conditions can be added with `{:else if expression}`, optionally ending in an `{:else}` clause. -```html +```sv {#if porridge.temperature > 100}

too hot!

{:else if 80 > porridge.temperature} @@ -186,6 +209,9 @@ Additional conditions can be added with `{:else if expression}`, optionally endi {#each expression as name, index}...{/each} ``` ```sv +{#each expression as name (key)}...{/each} +``` +```sv {#each expression as name, index (key)}...{/each} ``` ```sv @@ -196,7 +222,7 @@ Additional conditions can be added with `{:else if expression}`, optionally endi Iterating over lists of values can be done with an each block. -```html +```sv

Shopping list

    {#each items as item} @@ -211,7 +237,7 @@ You can use each blocks to iterate over any array or array-like value — that i An each block can also specify an *index*, equivalent to the second argument in an `array.map(...)` callback: -```html +```sv {#each items as item, i}
  • {i + 1}: {item.name} x {item.qty}
    • {/each} @@ -221,7 +247,12 @@ An each block can also specify an *index*, equivalent to the second argument in If a *key* expression is provided — which must uniquely identify each list item — Svelte will use it to diff the list when data changes, rather than adding or removing items at the end. The key can be any object, but strings and numbers are recommended since they allow identity to persist when the objects themselves change. -```html +```sv +{#each items as item (item.id)} +
  • {item.name} x {item.qty}
    • +{/each} + + {#each items as item, i (item.id)}
  • {i + 1}: {item.name} x {item.qty}
    • {/each} @@ -231,7 +262,7 @@ If a *key* expression is provided — which must uniquely identify each list ite You can freely use destructuring and rest patterns in each blocks. -```html +```sv {#each items as { id, name, qty }, i (id)}
  • {i + 1}: {name} x {qty}
    • {/each} @@ -249,7 +280,7 @@ You can freely use destructuring and rest patterns in each blocks. An each block can also have an `{:else}` clause, which is rendered if the list is empty. -```html +```sv {#each todos as todo}

    {todo.text}

    {:else} @@ -274,7 +305,7 @@ An each block can also have an `{:else}` clause, which is rendered if the list i Await blocks allow you to branch on the three possible states of a Promise — pending, fulfilled or rejected. -```html +```sv {#await promise}

    waiting for the promise to resolve...

    @@ -291,7 +322,7 @@ Await blocks allow you to branch on the three possible states of a Promise — p The `catch` block can be omitted if you don't need to render anything when the promise rejects (or no error is possible). -```html +```sv {#await promise}

    waiting for the promise to resolve...

    @@ -305,12 +336,39 @@ The `catch` block can be omitted if you don't need to render anything when the p If you don't care about the pending state, you can also omit the initial block. -```html +```sv {#await promise then value}

    The value is {value}

    {/await} ``` +### {#key ...} + +```sv +{#key expression}...{/key} +``` + +Key blocks destroy and recreate their contents when the value of an expression changes. + +--- + +This is useful if you want an element to play its transition whenever a value changes. + +```sv +{#key value} +
    {value}
    +{/key} +``` + +--- + +When used around components, this will cause them to be reinstantiated and reinitialised. + +```sv +{#key value} + +{/key} +``` ### {@html ...} @@ -326,7 +384,7 @@ The expression should be valid standalone HTML — `{@html "
    "}content{@html > Svelte does not sanitize expressions before injecting HTML. If the data comes from an untrusted source, you must sanitize it, or you are exposing your users to an XSS vulnerability. -```html +```sv

    {post.title}

    {@html post.content} @@ -349,7 +407,7 @@ The `{@debug ...}` tag offers an alternative to `console.log(...)`. It logs the It accepts a comma-separated list of variable names (not arbitrary expressions). -```html +```sv @@ -1320,7 +1398,7 @@ The `` element renders a component dynamically, using the comp If `this` is falsy, no component is rendered. -```html +```sv ``` @@ -1338,7 +1416,7 @@ If `this` is falsy, no component is rendered. The `` element allows you to add event listeners to the `window` object without worrying about removing them when the component is destroyed, or checking for the existence of `window` when server-side rendering. -```html +```sv ``` +> This behaviour will only work when the function passed to `onMount` *synchronously* returns a value. `async` functions always return a `Promise`, and as such cannot *synchronously* return a function. + #### `beforeUpdate` ```js @@ -62,7 +64,7 @@ Schedules a callback to run immediately before the component is updated after an > The first time the callback runs will be before the initial `onMount` -```html +```sv @@ -582,7 +586,7 @@ Animates a `blur` filter alongside an element's opacity. * `opacity` (`number`, default 0) - the opacity value to animate out to and in from * `amount` (`number`, default 5) - the size of the blur in pixels -```html +```sv @@ -621,7 +625,7 @@ Animates the x and y positions and the opacity of an element. `in` transitions a You can see the `fly` transition in action in the [transition tutorial](tutorial/adding-parameters-to-transitions). -```html +```sv - \ No newline at end of file + \ No newline at end of file diff --git a/site/content/examples/04-events/05-dom-event-forwarding/CustomButton.svelte b/site/content/examples/04-events/05-dom-event-forwarding/CustomButton.svelte new file mode 100644 index 0000000000..f521c1f471 --- /dev/null +++ b/site/content/examples/04-events/05-dom-event-forwarding/CustomButton.svelte @@ -0,0 +1,22 @@ + + + \ No newline at end of file diff --git a/site/content/examples/04-events/05-dom-event-forwarding/FancyButton.svelte b/site/content/examples/04-events/05-dom-event-forwarding/FancyButton.svelte deleted file mode 100644 index 68dcc68636..0000000000 --- a/site/content/examples/04-events/05-dom-event-forwarding/FancyButton.svelte +++ /dev/null @@ -1,15 +0,0 @@ - - - \ No newline at end of file diff --git a/site/content/examples/05-bindings/05-file-inputs/App.svelte b/site/content/examples/05-bindings/05-file-inputs/App.svelte new file mode 100644 index 0000000000..a3334dbd01 --- /dev/null +++ b/site/content/examples/05-bindings/05-file-inputs/App.svelte @@ -0,0 +1,37 @@ + + + + + + + + +{#if files} +

    Selected files:

    + {#each Array.from(files) as file} +

    {file.name} ({file.size} bytes)

    + {/each} +{/if} diff --git a/site/content/examples/05-bindings/05-file-inputs/meta.json b/site/content/examples/05-bindings/05-file-inputs/meta.json new file mode 100644 index 0000000000..92d0587e87 --- /dev/null +++ b/site/content/examples/05-bindings/05-file-inputs/meta.json @@ -0,0 +1,3 @@ +{ + "title": "File inputs" +} diff --git a/site/content/examples/05-bindings/05-select-bindings/App.svelte b/site/content/examples/05-bindings/06-select-bindings/App.svelte similarity index 100% rename from site/content/examples/05-bindings/05-select-bindings/App.svelte rename to site/content/examples/05-bindings/06-select-bindings/App.svelte diff --git a/site/content/examples/05-bindings/05-select-bindings/meta.json b/site/content/examples/05-bindings/06-select-bindings/meta.json similarity index 100% rename from site/content/examples/05-bindings/05-select-bindings/meta.json rename to site/content/examples/05-bindings/06-select-bindings/meta.json diff --git a/site/content/examples/05-bindings/06-multiple-select-bindings/App.svelte b/site/content/examples/05-bindings/07-multiple-select-bindings/App.svelte similarity index 100% rename from site/content/examples/05-bindings/06-multiple-select-bindings/App.svelte rename to site/content/examples/05-bindings/07-multiple-select-bindings/App.svelte diff --git a/site/content/examples/05-bindings/06-multiple-select-bindings/meta.json b/site/content/examples/05-bindings/07-multiple-select-bindings/meta.json similarity index 100% rename from site/content/examples/05-bindings/06-multiple-select-bindings/meta.json rename to site/content/examples/05-bindings/07-multiple-select-bindings/meta.json diff --git a/site/content/examples/05-bindings/07-each-block-bindings/App.svelte b/site/content/examples/05-bindings/08-each-block-bindings/App.svelte similarity index 89% rename from site/content/examples/05-bindings/07-each-block-bindings/App.svelte rename to site/content/examples/05-bindings/08-each-block-bindings/App.svelte index ff91612ec5..4d3d75420c 100644 --- a/site/content/examples/05-bindings/07-each-block-bindings/App.svelte +++ b/site/content/examples/05-bindings/08-each-block-bindings/App.svelte @@ -16,16 +16,10 @@ $: remaining = todos.filter(t => !t.done).length; - -

    Todos

    {#each todos as todo} -
    +
    {/each} diff --git a/site/content/examples/05-bindings/07-each-block-bindings/meta.json b/site/content/examples/05-bindings/08-each-block-bindings/meta.json similarity index 100% rename from site/content/examples/05-bindings/07-each-block-bindings/meta.json rename to site/content/examples/05-bindings/08-each-block-bindings/meta.json diff --git a/site/content/examples/05-bindings/08-media-elements/App.svelte b/site/content/examples/05-bindings/09-media-elements/App.svelte similarity index 95% rename from site/content/examples/05-bindings/08-media-elements/App.svelte rename to site/content/examples/05-bindings/09-media-elements/App.svelte index 469e9e12eb..7a071dbe49 100644 --- a/site/content/examples/05-bindings/08-media-elements/App.svelte +++ b/site/content/examples/05-bindings/09-media-elements/App.svelte @@ -109,8 +109,8 @@
    \ No newline at end of file +
    diff --git a/site/content/examples/06-lifecycle/03-tick/App.svelte b/site/content/examples/06-lifecycle/03-tick/App.svelte index c9cb6de420..477b5ffb79 100644 --- a/site/content/examples/06-lifecycle/03-tick/App.svelte +++ b/site/content/examples/06-lifecycle/03-tick/App.svelte @@ -4,7 +4,7 @@ let text = `Select some text and hit the tab key to toggle uppercase`; async function handleKeydown(event) { - if (event.which !== 9) return; + if (event.key !== 'Tab') return; event.preventDefault(); @@ -34,4 +34,4 @@ } - \ No newline at end of file + diff --git a/site/content/examples/09-transitions/04-custom-js-transitions/App.svelte b/site/content/examples/09-transitions/04-custom-js-transitions/App.svelte index 3b3fb94d1c..396c793639 100644 --- a/site/content/examples/09-transitions/04-custom-js-transitions/App.svelte +++ b/site/content/examples/09-transitions/04-custom-js-transitions/App.svelte @@ -4,7 +4,7 @@ function typewriter(node, { speed = 50 }) { const valid = ( node.childNodes.length === 1 && - node.childNodes[0].nodeType === 3 + node.childNodes[0].nodeType === Node.TEXT_NODE ); if (!valid) { @@ -33,4 +33,4 @@

    The quick brown fox jumps over the lazy dog

    -{/if} \ No newline at end of file +{/if} diff --git a/site/content/examples/10-animations/00-animate/App.svelte b/site/content/examples/10-animations/00-animate/App.svelte index 279821491b..a90d0ecfb5 100644 --- a/site/content/examples/10-animations/00-animate/App.svelte +++ b/site/content/examples/10-animations/00-animate/App.svelte @@ -112,7 +112,7 @@
    diff --git a/site/content/examples/21-miscellaneous/01-hacker-news/Item.svelte b/site/content/examples/21-miscellaneous/01-hacker-news/Item.svelte index e9cd617e96..608d04e497 100644 --- a/site/content/examples/21-miscellaneous/01-hacker-news/Item.svelte +++ b/site/content/examples/21-miscellaneous/01-hacker-news/Item.svelte @@ -3,6 +3,8 @@ export let item; export let returnTo; + + $: url = !item.domain ? `https://news.ycombinator.com/${item.url}` : item.url; + + \ No newline at end of file diff --git a/site/content/tutorial/05-events/06-dom-event-forwarding/app-a/FancyButton.svelte b/site/content/tutorial/05-events/06-dom-event-forwarding/app-a/FancyButton.svelte deleted file mode 100644 index b75f19a1f2..0000000000 --- a/site/content/tutorial/05-events/06-dom-event-forwarding/app-a/FancyButton.svelte +++ /dev/null @@ -1,15 +0,0 @@ - - - \ No newline at end of file diff --git a/site/content/tutorial/05-events/06-dom-event-forwarding/app-b/App.svelte b/site/content/tutorial/05-events/06-dom-event-forwarding/app-b/App.svelte index 1429cae207..e75c78106a 100644 --- a/site/content/tutorial/05-events/06-dom-event-forwarding/app-b/App.svelte +++ b/site/content/tutorial/05-events/06-dom-event-forwarding/app-b/App.svelte @@ -1,9 +1,9 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/site/content/tutorial/05-events/06-dom-event-forwarding/app-b/CustomButton.svelte b/site/content/tutorial/05-events/06-dom-event-forwarding/app-b/CustomButton.svelte new file mode 100644 index 0000000000..f521c1f471 --- /dev/null +++ b/site/content/tutorial/05-events/06-dom-event-forwarding/app-b/CustomButton.svelte @@ -0,0 +1,22 @@ + + + \ No newline at end of file diff --git a/site/content/tutorial/05-events/06-dom-event-forwarding/app-b/FancyButton.svelte b/site/content/tutorial/05-events/06-dom-event-forwarding/app-b/FancyButton.svelte deleted file mode 100644 index 68dcc68636..0000000000 --- a/site/content/tutorial/05-events/06-dom-event-forwarding/app-b/FancyButton.svelte +++ /dev/null @@ -1,15 +0,0 @@ - - - \ No newline at end of file diff --git a/site/content/tutorial/05-events/06-dom-event-forwarding/text.md b/site/content/tutorial/05-events/06-dom-event-forwarding/text.md index 0959e1d98b..be9ae77f89 100644 --- a/site/content/tutorial/05-events/06-dom-event-forwarding/text.md +++ b/site/content/tutorial/05-events/06-dom-event-forwarding/text.md @@ -4,7 +4,7 @@ title: DOM event forwarding Event forwarding works for DOM events too. -We want to get notified of clicks on our `` — to do that, we just need to forward `click` events on the `
    -
    \ No newline at end of file +
    diff --git a/site/content/tutorial/07-lifecycle/03-update/app-b/App.svelte b/site/content/tutorial/07-lifecycle/03-update/app-b/App.svelte index bdf42e28a9..97caca99d5 100644 --- a/site/content/tutorial/07-lifecycle/03-update/app-b/App.svelte +++ b/site/content/tutorial/07-lifecycle/03-update/app-b/App.svelte @@ -20,7 +20,7 @@ ]; function handleKeydown(event) { - if (event.which === 13) { + if (event.key === 'Enter') { const text = event.target.value; if (!text) return; @@ -104,4 +104,4 @@ - \ No newline at end of file + diff --git a/site/content/tutorial/07-lifecycle/04-tick/app-a/App.svelte b/site/content/tutorial/07-lifecycle/04-tick/app-a/App.svelte index 3386ff93df..97edefa935 100644 --- a/site/content/tutorial/07-lifecycle/04-tick/app-a/App.svelte +++ b/site/content/tutorial/07-lifecycle/04-tick/app-a/App.svelte @@ -2,7 +2,7 @@ let text = `Select some text and hit the tab key to toggle uppercase`; async function handleKeydown(event) { - if (event.which !== 9) return; + if (event.key !== 'Tab') return; event.preventDefault(); @@ -32,4 +32,4 @@ } - \ No newline at end of file + diff --git a/site/content/tutorial/07-lifecycle/04-tick/app-b/App.svelte b/site/content/tutorial/07-lifecycle/04-tick/app-b/App.svelte index c9cb6de420..477b5ffb79 100644 --- a/site/content/tutorial/07-lifecycle/04-tick/app-b/App.svelte +++ b/site/content/tutorial/07-lifecycle/04-tick/app-b/App.svelte @@ -4,7 +4,7 @@ let text = `Select some text and hit the tab key to toggle uppercase`; async function handleKeydown(event) { - if (event.which !== 9) return; + if (event.key !== 'Tab') return; event.preventDefault(); @@ -34,4 +34,4 @@ } - \ No newline at end of file + diff --git a/site/content/tutorial/07-lifecycle/04-tick/text.md b/site/content/tutorial/07-lifecycle/04-tick/text.md index b58b024ad6..8f5603a361 100644 --- a/site/content/tutorial/07-lifecycle/04-tick/text.md +++ b/site/content/tutorial/07-lifecycle/04-tick/text.md @@ -4,7 +4,7 @@ title: tick The `tick` function is unlike other lifecycle functions in that you can call it any time, not just when the component first initialises. It returns a promise that resolves as soon as any pending state changes have been applied to the DOM (or immediately, if there are no pending state changes). -When you invalidate component state in Svelte, it doesn't update the DOM immediately. Instead, it waits until the next *microtask* to see if there are any other changes that need to be applied, including in other components. Doing so avoids unnecessary work and allows the browser to batch things more effectively. +When you update component state in Svelte, it doesn't update the DOM immediately. Instead, it waits until the next *microtask* to see if there are any other changes that need to be applied, including in other components. Doing so avoids unnecessary work and allows the browser to batch things more effectively. You can see that behaviour in this example. Select a range of text and hit the tab key. Because the `

    goodbye

    `); - }, + } }; diff --git a/test/runtime/samples/binding-this-each-block-property-2/_config.js b/test/runtime/samples/binding-this-each-block-property-2/_config.js new file mode 100644 index 0000000000..5c288cd6d1 --- /dev/null +++ b/test/runtime/samples/binding-this-each-block-property-2/_config.js @@ -0,0 +1,53 @@ +let calls = []; +function callback(refs) { + calls.push(refs.map(({ ref }) => ({ ref }))); +} +export default { + html: ``, + props: { + callback + }, + after_test() { + calls = []; + }, + async test({ assert, component, target }) { + assert.equal(calls.length, 1); + assert.equal(calls[0].length, 0); + + await component.addItem(); + + let divs = target.querySelectorAll("div"); + + assert.equal(calls.length, 3); + assert.equal(calls[1].length, 1); + assert.equal(calls[1][0].ref, null); + assert.equal(calls[2].length, 1); + assert.equal(calls[2][0].ref, divs[0]); + + await component.addItem(); + + divs = target.querySelectorAll("div"); + + assert.equal(calls.length, 5); + assert.equal(calls[3].length, 2); + assert.equal(calls[3][0].ref, divs[0]); + assert.equal(calls[3][1].ref, null); + assert.equal(calls[4].length, 2); + assert.equal(calls[4][0].ref, divs[0]); + assert.equal(calls[4][1].ref, divs[1]); + + await component.addItem(); + + divs = target.querySelectorAll("div"); + + assert.equal(calls.length, 7); + assert.equal(calls[5].length, 3); + assert.equal(calls[5][0].ref, divs[0]); + assert.equal(calls[5][1].ref, divs[1]); + assert.equal(calls[5][2].ref, null); + assert.equal(calls[6].length, 3); + assert.equal(calls[6][0].ref, divs[0]); + assert.equal(calls[6][1].ref, divs[1]); + assert.equal(calls[6][2].ref, divs[2]); + } +}; diff --git a/test/runtime/samples/binding-this-each-block-property-2/main.svelte b/test/runtime/samples/binding-this-each-block-property-2/main.svelte new file mode 100644 index 0000000000..bc1efe725c --- /dev/null +++ b/test/runtime/samples/binding-this-each-block-property-2/main.svelte @@ -0,0 +1,17 @@ + + +{#each refs as xxx} +
    +{/each} \ No newline at end of file diff --git a/test/runtime/samples/binding-this-each-object-props/_config.js b/test/runtime/samples/binding-this-each-object-props/_config.js new file mode 100644 index 0000000000..5372667b82 --- /dev/null +++ b/test/runtime/samples/binding-this-each-object-props/_config.js @@ -0,0 +1,14 @@ +export default { + html: ``, + + async test({ assert, component, target }) { + component.visible = true; + assert.htmlEqual(target.innerHTML, ` +
    b
    b
    c
    c
    + `); + assert.equal(component.items1[1], target.querySelector('div')); + assert.equal(component.items2[1], target.querySelector('div:nth-child(2)')); + assert.equal(component.items1[2], target.querySelector('div:nth-child(3)')); + assert.equal(component.items2[2], target.querySelector('div:last-child')); + } +}; diff --git a/test/runtime/samples/binding-this-each-object-props/main.svelte b/test/runtime/samples/binding-this-each-object-props/main.svelte new file mode 100644 index 0000000000..9654a58418 --- /dev/null +++ b/test/runtime/samples/binding-this-each-object-props/main.svelte @@ -0,0 +1,13 @@ + + +{#each data as item (item.id)} +
    {item.text}
    +
    {item.text}
    +{/each} diff --git a/test/runtime/samples/binding-this-each-object-spread/_config.js b/test/runtime/samples/binding-this-each-object-spread/_config.js new file mode 100644 index 0000000000..cecec08db9 --- /dev/null +++ b/test/runtime/samples/binding-this-each-object-spread/_config.js @@ -0,0 +1,14 @@ +export default { + html: ``, + + async test({ assert, component, target }) { + component.visible = true; + assert.htmlEqual(target.innerHTML, ` +
    a
    a
    b
    b
    + `); + assert.equal(component.items1[1], target.querySelector('div')); + assert.equal(component.items2[1], target.querySelector('div:nth-child(2)')); + assert.equal(component.items1[2], target.querySelector('div:nth-child(3)')); + assert.equal(component.items2[2], target.querySelector('div:last-child')); + } +}; diff --git a/test/runtime/samples/binding-this-each-object-spread/main.svelte b/test/runtime/samples/binding-this-each-object-spread/main.svelte new file mode 100644 index 0000000000..256ed0ede6 --- /dev/null +++ b/test/runtime/samples/binding-this-each-object-spread/main.svelte @@ -0,0 +1,13 @@ + + +{#each data as {id, text} (id)} +
    {text}
    +
    {text}
    +{/each} diff --git a/test/runtime/samples/binding-width-height-a11y/_config.js b/test/runtime/samples/binding-width-height-a11y/_config.js index 5ab4a7ade7..93856bf0f6 100644 --- a/test/runtime/samples/binding-width-height-a11y/_config.js +++ b/test/runtime/samples/binding-width-height-a11y/_config.js @@ -1,8 +1,8 @@ export default { async test({ assert, target }) { - const object = target.querySelector('object'); + const iframe = target.querySelector('iframe'); - assert.equal(object.getAttribute('aria-hidden'), "true"); - assert.equal(object.getAttribute('tabindex'), "-1"); + assert.equal(iframe.getAttribute('aria-hidden'), "true"); + assert.equal(iframe.getAttribute('tabindex'), "-1"); } }; diff --git a/test/runtime/samples/bitmask-overflow-2/_config.js b/test/runtime/samples/bitmask-overflow-2/_config.js index 0b63791292..7304f6fa68 100644 --- a/test/runtime/samples/bitmask-overflow-2/_config.js +++ b/test/runtime/samples/bitmask-overflow-2/_config.js @@ -1,3 +1,3 @@ export default { - error: `potato is not defined`, + error: `potato is not defined` }; \ No newline at end of file diff --git a/test/runtime/samples/bitmask-overflow-3/_config.js b/test/runtime/samples/bitmask-overflow-3/_config.js index aee7d3237e..a55a73af1d 100644 --- a/test/runtime/samples/bitmask-overflow-3/_config.js +++ b/test/runtime/samples/bitmask-overflow-3/_config.js @@ -1,3 +1,3 @@ export default { - error: `A is not defined`, + error: `A is not defined` }; \ No newline at end of file diff --git a/test/runtime/samples/bitmask-overflow-if/_config.js b/test/runtime/samples/bitmask-overflow-if/_config.js new file mode 100644 index 0000000000..74bc70d414 --- /dev/null +++ b/test/runtime/samples/bitmask-overflow-if/_config.js @@ -0,0 +1,24 @@ +export default { + html: ` + 012345678910111213141516171819202122232425262728293031323334353637383940 + expected: true + if: true + + `, + + async test({ assert, component, target, window }) { + const button = target.querySelector("button"); + await button.dispatchEvent(new window.MouseEvent("click")); + + assert.htmlEqual( + target.innerHTML, + ` + 112345678910111213141516171819202122232425262728293031323334353637383940 + expected: false + if: false +
    + + ` + ); + } +}; diff --git a/test/runtime/samples/bitmask-overflow-if/main.svelte b/test/runtime/samples/bitmask-overflow-if/main.svelte new file mode 100644 index 0000000000..2c1c453091 --- /dev/null +++ b/test/runtime/samples/bitmask-overflow-if/main.svelte @@ -0,0 +1,62 @@ + + + +{_0}{_1}{_2}{_3}{_4}{_5}{_6}{_7}{_8}{_9}{_10}{_11}{_12}{_13}{_14}{_15}{_16}{_17}{_18}{_19}{_20}{_21}{_22}{_23}{_24}{_25}{_26}{_27}{_28}{_29}{_30}{_31}{_32}{_33}{_34}{_35}{_36}{_37}{_38}{_39}{_40} + +expected: {_a.indexOf(_0) && _0 === '0' && _1 === '1'} +{#if _a.indexOf(_0) && _0 === '0' && _1 === '1'} +if: true +{:else} +if: false +
    +{/if} + + \ No newline at end of file diff --git a/test/runtime/samples/bitmask-overflow-slot-2/_config.js b/test/runtime/samples/bitmask-overflow-slot-2/_config.js index b01bd81e00..08c0c2f902 100644 --- a/test/runtime/samples/bitmask-overflow-slot-2/_config.js +++ b/test/runtime/samples/bitmask-overflow-slot-2/_config.js @@ -90,7 +90,7 @@ export default { assert.deepEqual(component.reads, { _0: 2, - _1: 2, + _1: 2 }); } }; \ No newline at end of file diff --git a/test/runtime/samples/bitmask-overflow-slot-3/Echo.svelte b/test/runtime/samples/bitmask-overflow-slot-3/Echo.svelte new file mode 100644 index 0000000000..d3ecf142c9 --- /dev/null +++ b/test/runtime/samples/bitmask-overflow-slot-3/Echo.svelte @@ -0,0 +1,9 @@ + + + + \ No newline at end of file diff --git a/test/runtime/samples/bitmask-overflow-slot-3/_config.js b/test/runtime/samples/bitmask-overflow-slot-3/_config.js new file mode 100644 index 0000000000..93e548e5f7 --- /dev/null +++ b/test/runtime/samples/bitmask-overflow-slot-3/_config.js @@ -0,0 +1,30 @@ +export default { + + html: ` +

    _0_1_2_3_4_5_6_7_8_9_10_11_12_13_14_15_16_17_18_19_20_21_22_23_24_25_26_27_28_29_30_31_32_33_34_35_36_37_38_39_40

    +

    0

    + + `, + + async test({ assert, component, target, window }) { + // change from inside + const button = target.querySelector('button'); + await button.dispatchEvent(new window.MouseEvent('click')); + + assert.htmlEqual(target.innerHTML, ` +

    _0_1_2_3_4_5_6_7_8_9_10_11_12_13_14_15_16_17_18_19_20_21_22_23_24_25_26_27_28_29_30_31_32_33_34_35_36_37_38_39_40

    +

    1

    + + `); + + // change from outside + component._0 = 'a'; + component._40 = 'b'; + + assert.htmlEqual(target.innerHTML, ` +

    a_1_2_3_4_5_6_7_8_9_10_11_12_13_14_15_16_17_18_19_20_21_22_23_24_25_26_27_28_29_30_31_32_33_34_35_36_37_38_39b

    +

    1

    + + `); + } +}; \ No newline at end of file diff --git a/test/runtime/samples/bitmask-overflow-slot-3/main.svelte b/test/runtime/samples/bitmask-overflow-slot-3/main.svelte new file mode 100644 index 0000000000..ae798e4aee --- /dev/null +++ b/test/runtime/samples/bitmask-overflow-slot-3/main.svelte @@ -0,0 +1,11 @@ + + + +

    {_0}{_1}{_2}{_3}{_4}{_5}{_6}{_7}{_8}{_9}{_10}{_11}{_12}{_13}{_14}{_15}{_16}{_17}{_18}{_19}{_20}{_21}{_22}{_23}{_24}{_25}{_26}{_27}{_28}{_29}{_30}{_31}{_32}{_33}{_34}{_35}{_36}{_37}{_38}{_39}{_40}

    +

    {dummy}

    +     + diff --git a/test/runtime/samples/bitmask-overflow-slot-4/Echo.svelte b/test/runtime/samples/bitmask-overflow-slot-4/Echo.svelte new file mode 100644 index 0000000000..2e1beda492 --- /dev/null +++ b/test/runtime/samples/bitmask-overflow-slot-4/Echo.svelte @@ -0,0 +1,11 @@ + + +

    {_0}{_1}{_2}{_3}{_4}{_5}{_6}{_7}{_8}{_9}{_10}{_11}{_12}{_13}{_14}{_15}{_16}{_17}{_18}{_19}{_20}{_21}{_22}{_23}{_24}{_25}{_26}{_27}{_28}{_29}{_30}{_31}{_32}{_33}{_34}{_35}{_36}{_37}{_38}{_39}{_40}

    + + \ No newline at end of file diff --git a/test/runtime/samples/bitmask-overflow-slot-4/_config.js b/test/runtime/samples/bitmask-overflow-slot-4/_config.js new file mode 100644 index 0000000000..cdaa5de77f --- /dev/null +++ b/test/runtime/samples/bitmask-overflow-slot-4/_config.js @@ -0,0 +1,41 @@ +export default { + html: ` +

    _0_1_2_3_4_5_6_7_8_9_10_11_12_13_14_15_16_17_18_19_20_21_22_23_24_25_26_27_28_29_30_31_32_33_34_35_36_37_38_39_40

    +

    0

    +

    0

    + + `, + + async test({ assert, component, target, window }) { + // change from inside + const button = target.querySelector('button'); + await button.dispatchEvent(new window.MouseEvent('click')); + + assert.htmlEqual(target.innerHTML, ` +

    _0_1_2_3_4_5_6_7_8_9_10_11_12_13_14_15_16_17_18_19_20_21_22_23_24_25_26_27_28_29_30_31_32_33_34_35_36_37_38_39_40

    +

    0

    +

    1

    + + `); + + // change from outside + component._0 = 'a'; + + assert.htmlEqual(target.innerHTML, ` +

    _0_1_2_3_4_5_6_7_8_9_10_11_12_13_14_15_16_17_18_19_20_21_22_23_24_25_26_27_28_29_30_31_32_33_34_35_36_37_38_39_40

    +

    a

    +

    1

    + + `); + + // change from outside through props + component._40 = 'b'; + + assert.htmlEqual(target.innerHTML, ` +

    _0_1_2_3_4_5_6_7_8_9_10_11_12_13_14_15_16_17_18_19_20_21_22_23_24_25_26_27_28_29_30_31_32_33_34_35_36_37_38_39b

    +

    a

    +

    1

    + + `); + } +}; \ No newline at end of file diff --git a/test/runtime/samples/bitmask-overflow-slot-4/main.svelte b/test/runtime/samples/bitmask-overflow-slot-4/main.svelte new file mode 100644 index 0000000000..7e02487a30 --- /dev/null +++ b/test/runtime/samples/bitmask-overflow-slot-4/main.svelte @@ -0,0 +1,12 @@ + + + +

    {_0}

    +

    {dummy}

    +     + diff --git a/test/runtime/samples/bitmask-overflow-slot-5/Echo.svelte b/test/runtime/samples/bitmask-overflow-slot-5/Echo.svelte new file mode 100644 index 0000000000..dddb3f7642 --- /dev/null +++ b/test/runtime/samples/bitmask-overflow-slot-5/Echo.svelte @@ -0,0 +1,13 @@ + + +

    {_0}{_1}{_2}{_3}{_4}{_5}{_6}{_7}{_8}{_9}{_10}{_11}{_12}{_13}{_14}{_15}{_16}{_17}{_18}{_19}{_20}{_21}{_22}{_23}{_24}{_25}{_26}{_27}{_28}{_29}{_30}{_31}{_32}{_33}{_34}{_35}{_36}{_37}{_38}{_39}{_40}

    +

    {b}

    + + \ No newline at end of file diff --git a/test/runtime/samples/bitmask-overflow-slot-5/_config.js b/test/runtime/samples/bitmask-overflow-slot-5/_config.js new file mode 100644 index 0000000000..7dedb8f7eb --- /dev/null +++ b/test/runtime/samples/bitmask-overflow-slot-5/_config.js @@ -0,0 +1,49 @@ +export default { + html: ` +

    _0_1_2_3_4_5_6_7_8_9_10_11_12_13_14_15_16_17_18_19_20_21_22_23_24_25_26_27_28_29_30_31_32_33_34_35_36_37_38_39_40

    +

    b

    +

    -0-1-2-3-4-5-6-7-8-9-10-11-12-13-14-15-16-17-18-19-20-21-22-23-24-25-26-27-28-29-30-31-32-33-34-35-36-37-38-39-40

    +

    0

    +

    0

    + + `, + + async test({ assert, component, target, window }) { + // change from inside + const button = target.querySelector('button'); + await button.dispatchEvent(new window.MouseEvent('click')); + + assert.htmlEqual(target.innerHTML, ` +

    _0_1_2_3_4_5_6_7_8_9_10_11_12_13_14_15_16_17_18_19_20_21_22_23_24_25_26_27_28_29_30_31_32_33_34_35_36_37_38_39_40

    +

    b

    +

    -0-1-2-3-4-5-6-7-8-9-10-11-12-13-14-15-16-17-18-19-20-21-22-23-24-25-26-27-28-29-30-31-32-33-34-35-36-37-38-39-40

    +

    0

    +

    1

    + + `); + + // change from outside + component.a = 'AA'; + + assert.htmlEqual(target.innerHTML, ` +

    _0_1_2_3_4_5_6_7_8_9_10_11_12_13_14_15_16_17_18_19_20_21_22_23_24_25_26_27_28_29_30_31_32_33_34_35_36_37_38_39_40

    +

    b

    +

    -0-1-2-3-4-5-6-7-8-9-10-11-12-13-14-15-16-17-18-19-20-21-22-23-24-25-26-27-28-29-30-31-32-33-34-35-36-37-38-39-40

    +

    AA

    +

    1

    + + `); + + // change from outside through props + component.b = 'BB'; + + assert.htmlEqual(target.innerHTML, ` +

    _0_1_2_3_4_5_6_7_8_9_10_11_12_13_14_15_16_17_18_19_20_21_22_23_24_25_26_27_28_29_30_31_32_33_34_35_36_37_38_39_40

    +

    BB

    +

    -0-1-2-3-4-5-6-7-8-9-10-11-12-13-14-15-16-17-18-19-20-21-22-23-24-25-26-27-28-29-30-31-32-33-34-35-36-37-38-39-40

    +

    AA

    +

    1

    + + `); + } +}; \ No newline at end of file diff --git a/test/runtime/samples/bitmask-overflow-slot-5/main.svelte b/test/runtime/samples/bitmask-overflow-slot-5/main.svelte new file mode 100644 index 0000000000..b17d6f7bae --- /dev/null +++ b/test/runtime/samples/bitmask-overflow-slot-5/main.svelte @@ -0,0 +1,13 @@ + + + +

    {_0}{_1}{_2}{_3}{_4}{_5}{_6}{_7}{_8}{_9}{_10}{_11}{_12}{_13}{_14}{_15}{_16}{_17}{_18}{_19}{_20}{_21}{_22}{_23}{_24}{_25}{_26}{_27}{_28}{_29}{_30}{_31}{_32}{_33}{_34}{_35}{_36}{_37}{_38}{_39}{_40}

    +

    {a}

    +

    {dummy}

    +     + diff --git a/test/runtime/samples/bitmask-overflow-slot-6/Slotted.svelte b/test/runtime/samples/bitmask-overflow-slot-6/Slotted.svelte new file mode 100644 index 0000000000..322a31359e --- /dev/null +++ b/test/runtime/samples/bitmask-overflow-slot-6/Slotted.svelte @@ -0,0 +1,15 @@ + + +
    + + + + {#if open} + + {/if} +
    diff --git a/test/runtime/samples/bitmask-overflow-slot-6/_config.js b/test/runtime/samples/bitmask-overflow-slot-6/_config.js new file mode 100644 index 0000000000..8cd8c07a65 --- /dev/null +++ b/test/runtime/samples/bitmask-overflow-slot-6/_config.js @@ -0,0 +1,32 @@ +// overflow bitmask + slot missing `let:` +export default { + html: ` +
    + +
    + + `, + + async test({ assert, component, target, window }) { + const button = target.querySelectorAll('button')[1]; + const div = target.querySelector('div'); + await div.dispatchEvent(new window.MouseEvent('click')); + + assert.htmlEqual(target.innerHTML, ` +
    + +
    Open
    +
    + + `); + + await button.dispatchEvent(new window.MouseEvent('click')); + assert.htmlEqual(target.innerHTML, ` +
    + +
    Open
    +
    + + `); + } +}; \ No newline at end of file diff --git a/test/runtime/samples/bitmask-overflow-slot-6/main.svelte b/test/runtime/samples/bitmask-overflow-slot-6/main.svelte new file mode 100644 index 0000000000..8845cb2ef5 --- /dev/null +++ b/test/runtime/samples/bitmask-overflow-slot-6/main.svelte @@ -0,0 +1,23 @@ + + + + + +
    + Open +
    +     + + \ No newline at end of file diff --git a/test/runtime/samples/class-with-spread-and-bind/_config.js b/test/runtime/samples/class-with-spread-and-bind/_config.js index f3c54e8c52..cab46706ef 100644 --- a/test/runtime/samples/class-with-spread-and-bind/_config.js +++ b/test/runtime/samples/class-with-spread-and-bind/_config.js @@ -1,6 +1,6 @@ export default { props: { - primary: true, + primary: true }, html: `
    `, @@ -14,5 +14,5 @@ export default {
    ` ); - }, + } }; diff --git a/test/runtime/samples/component-binding-blowback-c/main.svelte b/test/runtime/samples/component-binding-blowback-c/main.svelte index 4876af13a8..75552bf358 100644 --- a/test/runtime/samples/component-binding-blowback-c/main.svelte +++ b/test/runtime/samples/component-binding-blowback-c/main.svelte @@ -4,7 +4,7 @@ export let count; export let idToValue = Object.create(null); - function ids() { + function ids(count) { return new Array(count) .fill(null) .map((_, i) => ({ id: 'id-' + i})) @@ -15,7 +15,7 @@
      - {#each ids() as object (object.id)} + {#each ids(count) as object (object.id)} {object.id}: value is {idToValue[object.id]} diff --git a/test/runtime/samples/component-binding-deep/_config.js b/test/runtime/samples/component-binding-deep/_config.js index be5a2624ac..8a2f5a56cf 100644 --- a/test/runtime/samples/component-binding-deep/_config.js +++ b/test/runtime/samples/component-binding-deep/_config.js @@ -21,5 +21,5 @@ export default {

      blah

      `); - }, + } }; diff --git a/test/runtime/samples/component-binding-store/Input.svelte b/test/runtime/samples/component-binding-store/Input.svelte new file mode 100644 index 0000000000..792104bec8 --- /dev/null +++ b/test/runtime/samples/component-binding-store/Input.svelte @@ -0,0 +1,5 @@ + + + \ No newline at end of file diff --git a/test/runtime/samples/component-binding-store/_config.js b/test/runtime/samples/component-binding-store/_config.js new file mode 100644 index 0000000000..8b8a7a170a --- /dev/null +++ b/test/runtime/samples/component-binding-store/_config.js @@ -0,0 +1,61 @@ +export default { + html: ` + + +
      + `, + + async test({ assert, component, target, window }) { + let count = 0; + component.callback = () => { + count++; + }; + + const [input1, input2] = target.querySelectorAll("input"); + + input1.value = "1"; + await input1.dispatchEvent(new window.Event("input")); + + assert.htmlEqual( + target.innerHTML, + ` + + +
      1
      + ` + ); + assert.equal(input1.value, "1"); + assert.equal(input2.value, "1"); + assert.equal(count, 1); + + input2.value = "123"; + await input2.dispatchEvent(new window.Event("input")); + + assert.htmlEqual( + target.innerHTML, + ` + + +
      123
      + ` + ); + assert.equal(input1.value, "123"); + assert.equal(input2.value, "123"); + assert.equal(count, 2); + + input1.value = "456"; + await input1.dispatchEvent(new window.Event("input")); + + assert.htmlEqual( + target.innerHTML, + ` + + +
      456
      + ` + ); + assert.equal(input1.value, "456"); + assert.equal(input2.value, "456"); + assert.equal(count, 3); + } +}; diff --git a/test/runtime/samples/component-binding-store/main.svelte b/test/runtime/samples/component-binding-store/main.svelte new file mode 100644 index 0000000000..dba08e5276 --- /dev/null +++ b/test/runtime/samples/component-binding-store/main.svelte @@ -0,0 +1,18 @@ + + + + + + +
      {$value.value}
      \ No newline at end of file diff --git a/test/runtime/samples/component-event-handler-contenteditable/_config.js b/test/runtime/samples/component-event-handler-contenteditable/_config.js new file mode 100644 index 0000000000..3a85734975 --- /dev/null +++ b/test/runtime/samples/component-event-handler-contenteditable/_config.js @@ -0,0 +1,15 @@ +export default { + html: ` +
      + `, + + async test({ assert, component, target, window }) { + const div = target.querySelector('div'); + const text = window.document.createTextNode('a'); + div.insertBefore(text, null); + const event = new window.InputEvent('input'); + await div.dispatchEvent(event); + + assert.equal(div.textContent, 'a'); + } +}; diff --git a/test/runtime/samples/component-event-handler-contenteditable/main.svelte b/test/runtime/samples/component-event-handler-contenteditable/main.svelte new file mode 100644 index 0000000000..1eb5911df8 --- /dev/null +++ b/test/runtime/samples/component-event-handler-contenteditable/main.svelte @@ -0,0 +1,6 @@ + + +
      {text}
      diff --git a/test/runtime/samples/component-event-not-stale/_config.js b/test/runtime/samples/component-event-not-stale/_config.js index 912ea1f7d0..7951afb9d5 100644 --- a/test/runtime/samples/component-event-not-stale/_config.js +++ b/test/runtime/samples/component-event-not-stale/_config.js @@ -1,6 +1,6 @@ export default { props: { - value: 1, + value: 1 }, test({ assert, component, target, window }) { @@ -26,5 +26,5 @@ export default { { value: 2 }, { value: 2 } ]); - }, + } }; diff --git a/test/runtime/samples/component-events-console/_config.js b/test/runtime/samples/component-events-console/_config.js index b800749785..39ccbd719f 100644 --- a/test/runtime/samples/component-events-console/_config.js +++ b/test/runtime/samples/component-events-console/_config.js @@ -21,5 +21,5 @@ export default { } console.log = log; - }, + } }; diff --git a/test/runtime/samples/component-namespace/Tooltip.svelte b/test/runtime/samples/component-namespace/Tooltip.svelte new file mode 100644 index 0000000000..9b44ef57a8 --- /dev/null +++ b/test/runtime/samples/component-namespace/Tooltip.svelte @@ -0,0 +1 @@ +

      i am a widget

      \ No newline at end of file diff --git a/test/runtime/samples/component-namespace/Widget.svelte b/test/runtime/samples/component-namespace/Widget.svelte new file mode 100644 index 0000000000..b6aa45c6a8 --- /dev/null +++ b/test/runtime/samples/component-namespace/Widget.svelte @@ -0,0 +1,5 @@ + \ No newline at end of file diff --git a/test/runtime/samples/component-namespace/_config.js b/test/runtime/samples/component-namespace/_config.js new file mode 100644 index 0000000000..5b96ac8df0 --- /dev/null +++ b/test/runtime/samples/component-namespace/_config.js @@ -0,0 +1,3 @@ +export default { + html: '

      i am a widget

      ' +}; diff --git a/test/runtime/samples/component-namespace/main.svelte b/test/runtime/samples/component-namespace/main.svelte new file mode 100644 index 0000000000..3f53b2b1c8 --- /dev/null +++ b/test/runtime/samples/component-namespace/main.svelte @@ -0,0 +1,8 @@ + + +{#each widgets as LazyWidget} + +{/each} \ No newline at end of file diff --git a/test/runtime/samples/component-shorthand-import/_config.js b/test/runtime/samples/component-shorthand-import/_config.js index ceb8e19f68..c955224600 100644 --- a/test/runtime/samples/component-shorthand-import/_config.js +++ b/test/runtime/samples/component-shorthand-import/_config.js @@ -1,3 +1,3 @@ export default { - html: `

      This is the widget.

      `, + html: `

      This is the widget.

      ` }; diff --git a/test/runtime/samples/component-slot-fallback-2/Inner.svelte b/test/runtime/samples/component-slot-fallback-2/Inner.svelte new file mode 100644 index 0000000000..d1c247ad35 --- /dev/null +++ b/test/runtime/samples/component-slot-fallback-2/Inner.svelte @@ -0,0 +1,7 @@ + + + +{value} \ No newline at end of file diff --git a/test/runtime/samples/component-slot-fallback-2/Outer.svelte b/test/runtime/samples/component-slot-fallback-2/Outer.svelte new file mode 100644 index 0000000000..1e44ba4db7 --- /dev/null +++ b/test/runtime/samples/component-slot-fallback-2/Outer.svelte @@ -0,0 +1,7 @@ + + + \ No newline at end of file diff --git a/test/runtime/samples/component-slot-fallback-2/_config.js b/test/runtime/samples/component-slot-fallback-2/_config.js new file mode 100644 index 0000000000..585e3b4c9e --- /dev/null +++ b/test/runtime/samples/component-slot-fallback-2/_config.js @@ -0,0 +1,39 @@ +export default { + html: ` `, + ssrHtml: ` `, + + async test({ assert, target, component, window }) { + const [input1, input2, inputFallback] = target.querySelectorAll("input"); + + assert.equal(component.getSubscriberCount(), 3); + + input1.value = "a"; + await input1.dispatchEvent(new window.Event("input")); + input1.value = "ab"; + await input1.dispatchEvent(new window.Event("input")); + assert.equal(input1.value, "ab"); + assert.equal(input2.value, "ab"); + assert.equal(inputFallback.value, "ab"); + + component.props = "hello"; + + assert.htmlEqual( + target.innerHTML, + ` + hello + hello + + ` + ); + + component.fallback = "world"; + assert.htmlEqual( + target.innerHTML, + ` + hello + hello + world + ` + ); + } +}; diff --git a/test/runtime/samples/component-slot-fallback-2/main.svelte b/test/runtime/samples/component-slot-fallback-2/main.svelte new file mode 100644 index 0000000000..4583667015 --- /dev/null +++ b/test/runtime/samples/component-slot-fallback-2/main.svelte @@ -0,0 +1,23 @@ + + + + + + + + + + + + diff --git a/test/runtime/samples/component-slot-fallback-2/store.svelte b/test/runtime/samples/component-slot-fallback-2/store.svelte new file mode 100644 index 0000000000..e377aaf314 --- /dev/null +++ b/test/runtime/samples/component-slot-fallback-2/store.svelte @@ -0,0 +1,23 @@ + \ No newline at end of file diff --git a/test/runtime/samples/component-slot-fallback-3/Inner.svelte b/test/runtime/samples/component-slot-fallback-3/Inner.svelte new file mode 100644 index 0000000000..db2af272d2 --- /dev/null +++ b/test/runtime/samples/component-slot-fallback-3/Inner.svelte @@ -0,0 +1,6 @@ + +
      Hello
      +
      world
      +
      Bye
      +
      World
      +       diff --git a/test/runtime/samples/component-slot-fallback-3/_config.js b/test/runtime/samples/component-slot-fallback-3/_config.js new file mode 100644 index 0000000000..25cc65eb2d --- /dev/null +++ b/test/runtime/samples/component-slot-fallback-3/_config.js @@ -0,0 +1,6 @@ +export default { + html: ` +
      Hello World
      +
      Hello
      world
      Bye
      World
      + ` +}; diff --git a/test/runtime/samples/component-slot-fallback-3/main.svelte b/test/runtime/samples/component-slot-fallback-3/main.svelte new file mode 100644 index 0000000000..eda7ea60e4 --- /dev/null +++ b/test/runtime/samples/component-slot-fallback-3/main.svelte @@ -0,0 +1,9 @@ + + + +
      Hello World
      +       + + diff --git a/test/runtime/samples/component-slot-fallback-4/Inner.svelte b/test/runtime/samples/component-slot-fallback-4/Inner.svelte new file mode 100644 index 0000000000..9eb3ef1401 --- /dev/null +++ b/test/runtime/samples/component-slot-fallback-4/Inner.svelte @@ -0,0 +1,3 @@ + + + foobar \ No newline at end of file diff --git a/test/runtime/samples/component-slot-fallback-4/_config.js b/test/runtime/samples/component-slot-fallback-4/_config.js new file mode 100644 index 0000000000..4ebe353513 --- /dev/null +++ b/test/runtime/samples/component-slot-fallback-4/_config.js @@ -0,0 +1,5 @@ +export default { + html: ` + foobar + ` +}; diff --git a/test/runtime/samples/component-slot-fallback-4/main.svelte b/test/runtime/samples/component-slot-fallback-4/main.svelte new file mode 100644 index 0000000000..206ce21def --- /dev/null +++ b/test/runtime/samples/component-slot-fallback-4/main.svelte @@ -0,0 +1,5 @@ + + + diff --git a/test/runtime/samples/component-slot-fallback-5/IconA.svelte b/test/runtime/samples/component-slot-fallback-5/IconA.svelte new file mode 100644 index 0000000000..8921b6c531 --- /dev/null +++ b/test/runtime/samples/component-slot-fallback-5/IconA.svelte @@ -0,0 +1 @@ +Icon A \ No newline at end of file diff --git a/test/runtime/samples/component-slot-fallback-5/IconB.svelte b/test/runtime/samples/component-slot-fallback-5/IconB.svelte new file mode 100644 index 0000000000..8a1a95ead3 --- /dev/null +++ b/test/runtime/samples/component-slot-fallback-5/IconB.svelte @@ -0,0 +1 @@ +Icon B \ No newline at end of file diff --git a/test/runtime/samples/component-slot-fallback-5/Inner.svelte b/test/runtime/samples/component-slot-fallback-5/Inner.svelte new file mode 100644 index 0000000000..bc4b224c23 --- /dev/null +++ b/test/runtime/samples/component-slot-fallback-5/Inner.svelte @@ -0,0 +1,13 @@ + + + +
      + + + +
      diff --git a/test/runtime/samples/component-slot-fallback-5/_config.js b/test/runtime/samples/component-slot-fallback-5/_config.js new file mode 100644 index 0000000000..fa374f3519 --- /dev/null +++ b/test/runtime/samples/component-slot-fallback-5/_config.js @@ -0,0 +1,31 @@ +export default { + html: ` + +
      Icon B
      + `, + + async test({ assert, target, window }) { + const btn = target.querySelector("button"); + const clickEvent = new window.MouseEvent("click"); + + await btn.dispatchEvent(clickEvent); + + assert.htmlEqual( + target.innerHTML, + ` + +
      Icon A
      + ` + ); + + await btn.dispatchEvent(clickEvent); + + assert.htmlEqual( + target.innerHTML, + ` + +
      Icon B
      + ` + ); + } +}; diff --git a/test/runtime/samples/component-slot-fallback-5/main.svelte b/test/runtime/samples/component-slot-fallback-5/main.svelte new file mode 100644 index 0000000000..206ce21def --- /dev/null +++ b/test/runtime/samples/component-slot-fallback-5/main.svelte @@ -0,0 +1,5 @@ + + + diff --git a/test/runtime/samples/component-slot-fallback-6/Foo.svelte b/test/runtime/samples/component-slot-fallback-6/Foo.svelte new file mode 100644 index 0000000000..0385342cef --- /dev/null +++ b/test/runtime/samples/component-slot-fallback-6/Foo.svelte @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/test/runtime/samples/component-slot-fallback-6/Inner.svelte b/test/runtime/samples/component-slot-fallback-6/Inner.svelte new file mode 100644 index 0000000000..28f0fdd869 --- /dev/null +++ b/test/runtime/samples/component-slot-fallback-6/Inner.svelte @@ -0,0 +1,9 @@ + + + + + {JSON.stringify($$props)} + + diff --git a/test/runtime/samples/component-slot-fallback-6/_config.js b/test/runtime/samples/component-slot-fallback-6/_config.js new file mode 100644 index 0000000000..fb1a658f26 --- /dev/null +++ b/test/runtime/samples/component-slot-fallback-6/_config.js @@ -0,0 +1,18 @@ +// $$props reactivity in slot fallback +export default { + html: ` + + {"value":""} + `, + + async test({ assert, target, window }) { + const input = target.querySelector("input"); + input.value = "abc"; + await input.dispatchEvent(new window.Event('input')); + + assert.htmlEqual(target.innerHTML, ` + + {"value":"abc"} + `); + } +}; diff --git a/test/runtime/samples/component-slot-fallback-6/main.svelte b/test/runtime/samples/component-slot-fallback-6/main.svelte new file mode 100644 index 0000000000..35abebef10 --- /dev/null +++ b/test/runtime/samples/component-slot-fallback-6/main.svelte @@ -0,0 +1,8 @@ + + + + + diff --git a/test/runtime/samples/component-slot-fallback-empty/Nested.svelte b/test/runtime/samples/component-slot-fallback-empty/Nested.svelte new file mode 100644 index 0000000000..9e6683feb7 --- /dev/null +++ b/test/runtime/samples/component-slot-fallback-empty/Nested.svelte @@ -0,0 +1,4 @@ +
      +

      default fallback content

       + bar fallback +
      \ No newline at end of file diff --git a/test/runtime/samples/component-slot-fallback-empty/_config.js b/test/runtime/samples/component-slot-fallback-empty/_config.js new file mode 100644 index 0000000000..2e153d24db --- /dev/null +++ b/test/runtime/samples/component-slot-fallback-empty/_config.js @@ -0,0 +1,13 @@ +export default { + html: ` +
      +

      default fallback content

      + +
      + +
      +

      default fallback content

      + bar fallback +
      + ` +}; diff --git a/test/runtime/samples/component-slot-fallback-empty/main.svelte b/test/runtime/samples/component-slot-fallback-empty/main.svelte new file mode 100644 index 0000000000..7ae5f4c5d7 --- /dev/null +++ b/test/runtime/samples/component-slot-fallback-empty/main.svelte @@ -0,0 +1,10 @@ + + + + + + + + diff --git a/test/runtime/samples/component-slot-let-in-slot/_config.js b/test/runtime/samples/component-slot-let-in-slot/_config.js index a86d869581..eb16c27fda 100644 --- a/test/runtime/samples/component-slot-let-in-slot/_config.js +++ b/test/runtime/samples/component-slot-let-in-slot/_config.js @@ -1,6 +1,6 @@ export default { props: { - prop: 'a', + prop: 'a' }, html: 'a', diff --git a/test/runtime/samples/component-slot-nested-error-2/Nested.svelte b/test/runtime/samples/component-slot-nested-error-2/Nested.svelte new file mode 100644 index 0000000000..c6f086d96c --- /dev/null +++ b/test/runtime/samples/component-slot-nested-error-2/Nested.svelte @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/test/runtime/samples/component-slot-nested-error-2/_config.js b/test/runtime/samples/component-slot-nested-error-2/_config.js new file mode 100644 index 0000000000..98a9f1cab0 --- /dev/null +++ b/test/runtime/samples/component-slot-nested-error-2/_config.js @@ -0,0 +1,3 @@ +export default { + error: [`Element with a slot='...' attribute must be a child of a component or a descendant of a custom element`] +}; diff --git a/test/runtime/samples/component-slot-nested-error-2/main.svelte b/test/runtime/samples/component-slot-nested-error-2/main.svelte new file mode 100644 index 0000000000..a7142d6dc1 --- /dev/null +++ b/test/runtime/samples/component-slot-nested-error-2/main.svelte @@ -0,0 +1,11 @@ + + + +
      +
      +
      +
      +
      + diff --git a/test/runtime/samples/component-slot-nested-error-3/Nested.svelte b/test/runtime/samples/component-slot-nested-error-3/Nested.svelte new file mode 100644 index 0000000000..c6f086d96c --- /dev/null +++ b/test/runtime/samples/component-slot-nested-error-3/Nested.svelte @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/test/runtime/samples/component-slot-nested-error-3/_config.js b/test/runtime/samples/component-slot-nested-error-3/_config.js new file mode 100644 index 0000000000..98a9f1cab0 --- /dev/null +++ b/test/runtime/samples/component-slot-nested-error-3/_config.js @@ -0,0 +1,3 @@ +export default { + error: [`Element with a slot='...' attribute must be a child of a component or a descendant of a custom element`] +}; diff --git a/test/runtime/samples/component-slot-nested-error-3/main.svelte b/test/runtime/samples/component-slot-nested-error-3/main.svelte new file mode 100644 index 0000000000..a63b1defde --- /dev/null +++ b/test/runtime/samples/component-slot-nested-error-3/main.svelte @@ -0,0 +1,11 @@ + + + +
      +
      +
      +
      +
      + diff --git a/test/runtime/samples/component-slot-nested-error/Nested.svelte b/test/runtime/samples/component-slot-nested-error/Nested.svelte new file mode 100644 index 0000000000..c6f086d96c --- /dev/null +++ b/test/runtime/samples/component-slot-nested-error/Nested.svelte @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/test/runtime/samples/component-slot-nested-error/_config.js b/test/runtime/samples/component-slot-nested-error/_config.js new file mode 100644 index 0000000000..98a9f1cab0 --- /dev/null +++ b/test/runtime/samples/component-slot-nested-error/_config.js @@ -0,0 +1,3 @@ +export default { + error: [`Element with a slot='...' attribute must be a child of a component or a descendant of a custom element`] +}; diff --git a/test/runtime/samples/component-slot-nested-error/main.svelte b/test/runtime/samples/component-slot-nested-error/main.svelte new file mode 100644 index 0000000000..531c96f08c --- /dev/null +++ b/test/runtime/samples/component-slot-nested-error/main.svelte @@ -0,0 +1,9 @@ + + + +
      +
      +
      + diff --git a/test/runtime/samples/component-slot-nested-if/Display.svelte b/test/runtime/samples/component-slot-nested-if/Display.svelte new file mode 100644 index 0000000000..d9034e4be2 --- /dev/null +++ b/test/runtime/samples/component-slot-nested-if/Display.svelte @@ -0,0 +1,2 @@ +Display: + \ No newline at end of file diff --git a/test/runtime/samples/component-slot-nested-if/Input.svelte b/test/runtime/samples/component-slot-nested-if/Input.svelte new file mode 100644 index 0000000000..fd8f22db00 --- /dev/null +++ b/test/runtime/samples/component-slot-nested-if/Input.svelte @@ -0,0 +1,6 @@ + + + + \ No newline at end of file diff --git a/test/runtime/samples/component-slot-nested-if/_config.js b/test/runtime/samples/component-slot-nested-if/_config.js new file mode 100644 index 0000000000..45c570fc22 --- /dev/null +++ b/test/runtime/samples/component-slot-nested-if/_config.js @@ -0,0 +1,30 @@ +export default { + html: ` + + `, + async test({ assert, target, snapshot, component, window }) { + const input = target.querySelector('input'); + + input.value = 'a'; + await input.dispatchEvent(new window.Event('input')); + + assert.htmlEqual( + target.innerHTML, + ` + + Display: a + ` + ); + + input.value = 'abc'; + await input.dispatchEvent(new window.Event('input')); + + assert.htmlEqual( + target.innerHTML, + ` + + Display: abc + ` + ); + } +}; diff --git a/test/runtime/samples/component-slot-nested-if/main.svelte b/test/runtime/samples/component-slot-nested-if/main.svelte new file mode 100644 index 0000000000..727927b157 --- /dev/null +++ b/test/runtime/samples/component-slot-nested-if/main.svelte @@ -0,0 +1,10 @@ + + + + {#if foo} + {foo} + {/if} + diff --git a/test/runtime/samples/component-slot-warning/Nested.svelte b/test/runtime/samples/component-slot-warning/Nested.svelte new file mode 100644 index 0000000000..c6f086d96c --- /dev/null +++ b/test/runtime/samples/component-slot-warning/Nested.svelte @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/test/runtime/samples/component-slot-warning/_config.js b/test/runtime/samples/component-slot-warning/_config.js new file mode 100644 index 0000000000..6ffe624782 --- /dev/null +++ b/test/runtime/samples/component-slot-warning/_config.js @@ -0,0 +1,9 @@ +export default { + compileOptions: { + dev: true + }, + warnings: [ + ' received an unexpected slot "default".', + ' received an unexpected slot "slot1".' + ] +}; diff --git a/test/runtime/samples/component-slot-warning/main.svelte b/test/runtime/samples/component-slot-warning/main.svelte new file mode 100644 index 0000000000..c29ef3e85b --- /dev/null +++ b/test/runtime/samples/component-slot-warning/main.svelte @@ -0,0 +1,7 @@ + + + + + diff --git a/test/runtime/samples/deconflict-anchor/Anchor.svelte b/test/runtime/samples/deconflict-anchor/Anchor.svelte new file mode 100644 index 0000000000..e758d60056 --- /dev/null +++ b/test/runtime/samples/deconflict-anchor/Anchor.svelte @@ -0,0 +1 @@ +

      Anchor

      diff --git a/test/runtime/samples/deconflict-anchor/_config.js b/test/runtime/samples/deconflict-anchor/_config.js new file mode 100644 index 0000000000..817dd42fcb --- /dev/null +++ b/test/runtime/samples/deconflict-anchor/_config.js @@ -0,0 +1,4 @@ +export default { + preserveIdentifiers: true, + html: `

      Anchor

      ` +}; diff --git a/test/runtime/samples/deconflict-anchor/main.svelte b/test/runtime/samples/deconflict-anchor/main.svelte new file mode 100644 index 0000000000..cce6281e49 --- /dev/null +++ b/test/runtime/samples/deconflict-anchor/main.svelte @@ -0,0 +1,5 @@ + + + diff --git a/test/runtime/samples/deconflict-builtins-2/_config.js b/test/runtime/samples/deconflict-builtins-2/_config.js index 5870ff073b..1489f83dc4 100644 --- a/test/runtime/samples/deconflict-builtins-2/_config.js +++ b/test/runtime/samples/deconflict-builtins-2/_config.js @@ -1,4 +1,4 @@ export default { html: `hello world`, - preserveIdentifiers: true, + preserveIdentifiers: true }; \ No newline at end of file diff --git a/test/runtime/samples/deconflict-contextual-bind/Widget.svelte b/test/runtime/samples/deconflict-contextual-bind/Widget.svelte new file mode 100644 index 0000000000..3aaa59b747 --- /dev/null +++ b/test/runtime/samples/deconflict-contextual-bind/Widget.svelte @@ -0,0 +1,3 @@ + diff --git a/test/runtime/samples/deconflict-contextual-bind/_config.js b/test/runtime/samples/deconflict-contextual-bind/_config.js new file mode 100644 index 0000000000..7602cde023 --- /dev/null +++ b/test/runtime/samples/deconflict-contextual-bind/_config.js @@ -0,0 +1,3 @@ +export default { + preserveIdentifiers: true +}; diff --git a/test/runtime/samples/deconflict-contextual-bind/main.svelte b/test/runtime/samples/deconflict-contextual-bind/main.svelte new file mode 100644 index 0000000000..fe91deca17 --- /dev/null +++ b/test/runtime/samples/deconflict-contextual-bind/main.svelte @@ -0,0 +1,8 @@ + + +{#each values as value} + +{/each} diff --git a/test/runtime/samples/dev-warning-each-block-no-sets-maps/_config.js b/test/runtime/samples/dev-warning-each-block-no-sets-maps/_config.js new file mode 100644 index 0000000000..83481d9ebe --- /dev/null +++ b/test/runtime/samples/dev-warning-each-block-no-sets-maps/_config.js @@ -0,0 +1,6 @@ +export default { + compileOptions: { + dev: true + }, + error: `{#each} only iterates over array-like objects. You can use a spread to convert this iterable into an array.` +}; diff --git a/test/runtime/samples/dev-warning-each-block-no-sets-maps/main.svelte b/test/runtime/samples/dev-warning-each-block-no-sets-maps/main.svelte new file mode 100644 index 0000000000..e1aae26d12 --- /dev/null +++ b/test/runtime/samples/dev-warning-each-block-no-sets-maps/main.svelte @@ -0,0 +1,7 @@ + + +{#each foo as item} +
      {item}
      +{/each} \ No newline at end of file diff --git a/test/runtime/samples/dev-warning-each-block-require-arraylike/_config.js b/test/runtime/samples/dev-warning-each-block-require-arraylike/_config.js new file mode 100644 index 0000000000..62e5fc209b --- /dev/null +++ b/test/runtime/samples/dev-warning-each-block-require-arraylike/_config.js @@ -0,0 +1,6 @@ +export default { + compileOptions: { + dev: true + }, + error: `{#each} only iterates over array-like objects.` +}; diff --git a/test/runtime/samples/dev-warning-each-block-require-arraylike/main.svelte b/test/runtime/samples/dev-warning-each-block-require-arraylike/main.svelte new file mode 100644 index 0000000000..f85df8d84b --- /dev/null +++ b/test/runtime/samples/dev-warning-each-block-require-arraylike/main.svelte @@ -0,0 +1,3 @@ +{#each {} as item} +
      {item}
      +{/each} \ No newline at end of file diff --git a/test/runtime/samples/dev-warning-missing-data-each/_config.js b/test/runtime/samples/dev-warning-missing-data-each/_config.js index 92cda48fce..7d7794eff4 100644 --- a/test/runtime/samples/dev-warning-missing-data-each/_config.js +++ b/test/runtime/samples/dev-warning-missing-data-each/_config.js @@ -7,18 +7,18 @@ export default { letters: [ { id: 1, - char: 'a', + char: 'a' }, { id: 2, - char: 'b', + char: 'b' }, { id: 3, - char: 'c', - }, - ], + char: 'c' + } + ] }, - warnings: [], + warnings: [] }; diff --git a/test/runtime/samples/dev-warning-unknown-props-2/Foo.svelte b/test/runtime/samples/dev-warning-unknown-props-2/Foo.svelte new file mode 100644 index 0000000000..bc56c4d894 --- /dev/null +++ b/test/runtime/samples/dev-warning-unknown-props-2/Foo.svelte @@ -0,0 +1 @@ +Foo diff --git a/test/runtime/samples/dev-warning-unknown-props-2/_config.js b/test/runtime/samples/dev-warning-unknown-props-2/_config.js new file mode 100644 index 0000000000..9bff4a2a74 --- /dev/null +++ b/test/runtime/samples/dev-warning-unknown-props-2/_config.js @@ -0,0 +1,9 @@ +export default { + compileOptions: { + dev: true + }, + + warnings: [ + ` was created with unknown prop 'fo'` + ] +}; diff --git a/test/runtime/samples/dev-warning-unknown-props-2/main.svelte b/test/runtime/samples/dev-warning-unknown-props-2/main.svelte new file mode 100644 index 0000000000..1566cf3e41 --- /dev/null +++ b/test/runtime/samples/dev-warning-unknown-props-2/main.svelte @@ -0,0 +1,5 @@ + + + diff --git a/test/runtime/samples/dev-warning-unknown-props-with-$$props/Foo.svelte b/test/runtime/samples/dev-warning-unknown-props-with-$$props/Foo.svelte index 9e5c62339d..375b1a6a0a 100644 --- a/test/runtime/samples/dev-warning-unknown-props-with-$$props/Foo.svelte +++ b/test/runtime/samples/dev-warning-unknown-props-with-$$props/Foo.svelte @@ -4,4 +4,4 @@
      {foo}
      -
      {JSON.stringify($$props)}
      +
      {JSON.stringify($$restProps)}
      diff --git a/test/runtime/samples/dev-warning-unknown-props-with-$$rest/Foo.svelte b/test/runtime/samples/dev-warning-unknown-props-with-$$rest/Foo.svelte new file mode 100644 index 0000000000..9e5c62339d --- /dev/null +++ b/test/runtime/samples/dev-warning-unknown-props-with-$$rest/Foo.svelte @@ -0,0 +1,7 @@ + + +
      {foo}
      +
      {JSON.stringify($$props)}
      diff --git a/test/runtime/samples/dev-warning-unknown-props-with-$$rest/_config.js b/test/runtime/samples/dev-warning-unknown-props-with-$$rest/_config.js new file mode 100644 index 0000000000..62ad08624d --- /dev/null +++ b/test/runtime/samples/dev-warning-unknown-props-with-$$rest/_config.js @@ -0,0 +1,7 @@ +export default { + compileOptions: { + dev: true + }, + + warnings: [] +}; diff --git a/test/runtime/samples/dev-warning-unknown-props-with-$$rest/main.svelte b/test/runtime/samples/dev-warning-unknown-props-with-$$rest/main.svelte new file mode 100644 index 0000000000..1566cf3e41 --- /dev/null +++ b/test/runtime/samples/dev-warning-unknown-props-with-$$rest/main.svelte @@ -0,0 +1,5 @@ + + + diff --git a/test/runtime/samples/document-event/_config.js b/test/runtime/samples/document-event/_config.js index f5e4b46f4f..d9a8866275 100644 --- a/test/runtime/samples/document-event/_config.js +++ b/test/runtime/samples/document-event/_config.js @@ -9,5 +9,5 @@ export default { const event2 = new window.Event('mouseleave'); window.document.body.dispatchEvent(event2); assert.deepEqual(component.events, ['enter', 'leave']); - }, + } }; diff --git a/test/runtime/samples/each-block-array-literal/_config.js b/test/runtime/samples/each-block-array-literal/_config.js index 288d1cd09f..164e4730bc 100644 --- a/test/runtime/samples/each-block-array-literal/_config.js +++ b/test/runtime/samples/each-block-array-literal/_config.js @@ -15,5 +15,5 @@ export default { button.dispatchEvent(event); assert.equal(component.clicked, 'racoon'); - }, + } }; diff --git a/test/runtime/samples/each-block-destructured-array-sparse/_config.js b/test/runtime/samples/each-block-destructured-array-sparse/_config.js index 9805276600..331c3aec1b 100644 --- a/test/runtime/samples/each-block-destructured-array-sparse/_config.js +++ b/test/runtime/samples/each-block-destructured-array-sparse/_config.js @@ -16,5 +16,5 @@ export default { assert.htmlEqual( target.innerHTML, `

      bar

      `); - }, + } }; diff --git a/test/runtime/samples/each-block-destructured-array/_config.js b/test/runtime/samples/each-block-destructured-array/_config.js index 432d8a3a78..e2924c8656 100644 --- a/test/runtime/samples/each-block-destructured-array/_config.js +++ b/test/runtime/samples/each-block-destructured-array/_config.js @@ -16,5 +16,5 @@ export default { assert.htmlEqual( target.innerHTML, `

      foo: bar

      `); - }, + } }; diff --git a/test/runtime/samples/each-block-destructured-default/_config.js b/test/runtime/samples/each-block-destructured-default/_config.js new file mode 100644 index 0000000000..0e99fd589f --- /dev/null +++ b/test/runtime/samples/each-block-destructured-default/_config.js @@ -0,0 +1,22 @@ +export default { + props: { + animalEntries: [ + { animal: 'raccoon', class: 'mammal', species: 'P. lotor', kilogram: 25 }, + { animal: 'eagle', class: 'bird', kilogram: 5.4 } + ] + }, + + html: ` +

      raccoon - P. lotor - 25kg

      +

      eagle - unknown - 5.4kg

      + `, + + + + test({ assert, component, target }) { + component.animalEntries = [{ animal: 'cow', class: 'mammal', species: '‎B. taurus' }]; + assert.htmlEqual(target.innerHTML, ` +

      cow - ‎B. taurus - 50kg

      + `); + } +}; diff --git a/test/runtime/samples/each-block-destructured-default/main.svelte b/test/runtime/samples/each-block-destructured-default/main.svelte new file mode 100644 index 0000000000..a91b45299e --- /dev/null +++ b/test/runtime/samples/each-block-destructured-default/main.svelte @@ -0,0 +1,7 @@ + + +{#each animalEntries as { animal, species = 'unknown', kilogram: weight = 50 , ...props } } +

      {animal} - {species} - {weight}kg

      +{/each} diff --git a/test/runtime/samples/each-block-destructured-object-binding/_config.js b/test/runtime/samples/each-block-destructured-object-binding/_config.js index 8b59a97034..2ab3e24397 100644 --- a/test/runtime/samples/each-block-destructured-object-binding/_config.js +++ b/test/runtime/samples/each-block-destructured-object-binding/_config.js @@ -1,6 +1,6 @@ export default { props: { - people: [{ name: { first: 'Doctor', last: 'Who' } }], + people: [{ name: { first: 'Doctor', last: 'Who' } }] }, html: ` @@ -41,5 +41,5 @@ export default {

      Frank Oz

      `); - }, + } }; diff --git a/test/runtime/samples/each-block-destructured-object-reserved-key/_config.js b/test/runtime/samples/each-block-destructured-object-reserved-key/_config.js new file mode 100644 index 0000000000..c04e984691 --- /dev/null +++ b/test/runtime/samples/each-block-destructured-object-reserved-key/_config.js @@ -0,0 +1,5 @@ +export default { + html: ` +

      bar

      + ` +}; diff --git a/test/runtime/samples/each-block-destructured-object-reserved-key/main.svelte b/test/runtime/samples/each-block-destructured-object-reserved-key/main.svelte new file mode 100644 index 0000000000..c3e11c3ea1 --- /dev/null +++ b/test/runtime/samples/each-block-destructured-object-reserved-key/main.svelte @@ -0,0 +1,7 @@ + + +{#each foo as { in: bar }} +

      {bar}

      +{/each} diff --git a/test/runtime/samples/each-block-destructured-object-rest/_config.js b/test/runtime/samples/each-block-destructured-object-rest/_config.js index 561d4e8442..be5d38b555 100644 --- a/test/runtime/samples/each-block-destructured-object-rest/_config.js +++ b/test/runtime/samples/each-block-destructured-object-rest/_config.js @@ -16,5 +16,5 @@ export default { assert.htmlEqual(target.innerHTML, `

      cow

      `); - }, + } }; diff --git a/test/runtime/samples/each-block-destructured-object/_config.js b/test/runtime/samples/each-block-destructured-object/_config.js index dc3943fffe..feec72f402 100644 --- a/test/runtime/samples/each-block-destructured-object/_config.js +++ b/test/runtime/samples/each-block-destructured-object/_config.js @@ -16,5 +16,5 @@ export default { assert.htmlEqual( target.innerHTML, `

      cow: hooves

      `); - }, + } }; diff --git a/test/runtime/samples/each-block-else-mount-or-intro/_config.js b/test/runtime/samples/each-block-else-mount-or-intro/_config.js index 8460a4b5e0..acf2bafd5f 100644 --- a/test/runtime/samples/each-block-else-mount-or-intro/_config.js +++ b/test/runtime/samples/each-block-else-mount-or-intro/_config.js @@ -1,4 +1,4 @@ export default { props: { items: [] }, - html: `No items.`, + html: `No items.` }; diff --git a/test/runtime/samples/each-block-in-if-block/_config.js b/test/runtime/samples/each-block-in-if-block/_config.js index eda3ca14a9..082b9b3033 100644 --- a/test/runtime/samples/each-block-in-if-block/_config.js +++ b/test/runtime/samples/each-block-in-if-block/_config.js @@ -1,7 +1,7 @@ export default { props: { dummy: false, - fruits: ['Apple', 'Banana', 'Tomato'], + fruits: ['Apple', 'Banana', 'Tomato'] }, html: '
      Apple
      Banana
      Tomato
      ', diff --git a/test/runtime/samples/each-block-keyed-component-action/Component.svelte b/test/runtime/samples/each-block-keyed-component-action/Component.svelte new file mode 100644 index 0000000000..18a6c7452a --- /dev/null +++ b/test/runtime/samples/each-block-keyed-component-action/Component.svelte @@ -0,0 +1,5 @@ + + +
      diff --git a/test/runtime/samples/each-block-keyed-component-action/_config.js b/test/runtime/samples/each-block-keyed-component-action/_config.js new file mode 100644 index 0000000000..66c609be01 --- /dev/null +++ b/test/runtime/samples/each-block-keyed-component-action/_config.js @@ -0,0 +1,21 @@ +export default { + test({ assert, component, raf }) { + assert.equal(component.count, 0); + + component.arr = ["2"]; + + assert.equal(component.count, 1); + + component.arr = ["1", "2"]; + + assert.equal(component.count, 2); + + component.arr = ["2", "1"]; + + assert.equal(component.count, 2); + + component.arr = []; + + assert.equal(component.count, 0); + } +}; diff --git a/test/runtime/samples/each-block-keyed-component-action/main.svelte b/test/runtime/samples/each-block-keyed-component-action/main.svelte new file mode 100644 index 0000000000..bfacdf402a --- /dev/null +++ b/test/runtime/samples/each-block-keyed-component-action/main.svelte @@ -0,0 +1,17 @@ + + +{#each arr as item (item)} + +{/each} diff --git a/test/runtime/samples/each-block-keyed-dyanmic-key/_config.js b/test/runtime/samples/each-block-keyed-dyanmic-key/_config.js new file mode 100644 index 0000000000..0aed1b0e07 --- /dev/null +++ b/test/runtime/samples/each-block-keyed-dyanmic-key/_config.js @@ -0,0 +1,27 @@ +let count = 0; +let value = 'foo'; + +export default { + props: { + value() { + count++; + return value; + } + }, + + html: ` +
      foo
      +
      foo
      + `, + + test({ assert, component, target }) { + value = 'bar'; + component.id = 1; + + assert.equal(count, 4); + assert.htmlEqual(target.innerHTML, ` +
      bar
      +
      bar
      + `); + } +}; diff --git a/test/runtime/samples/each-block-keyed-dyanmic-key/main.svelte b/test/runtime/samples/each-block-keyed-dyanmic-key/main.svelte new file mode 100644 index 0000000000..9a15c7d98e --- /dev/null +++ b/test/runtime/samples/each-block-keyed-dyanmic-key/main.svelte @@ -0,0 +1,8 @@ + + +{#each ['foo', 'bar'] as key (id + key)} +
      {value()}
      +{/each} \ No newline at end of file diff --git a/test/runtime/samples/each-block-keyed-dynamic-2/_config.js b/test/runtime/samples/each-block-keyed-dynamic-2/_config.js new file mode 100644 index 0000000000..7eba75a5ff --- /dev/null +++ b/test/runtime/samples/each-block-keyed-dynamic-2/_config.js @@ -0,0 +1,23 @@ +export default { + html: ` + + 0 +
        + `, + + async test({ assert, component, target, window }) { + const button = target.querySelector("button"); + + const event = new window.MouseEvent("click"); + await button.dispatchEvent(event); + + assert.htmlEqual( + target.innerHTML, + ` + + 1 +
          + ` + ); + } +}; diff --git a/test/runtime/samples/each-block-keyed-dynamic-2/main.svelte b/test/runtime/samples/each-block-keyed-dynamic-2/main.svelte new file mode 100644 index 0000000000..ab455a585e --- /dev/null +++ b/test/runtime/samples/each-block-keyed-dynamic-2/main.svelte @@ -0,0 +1,20 @@ + + + +{num} +
            + {#each cards as c, i (i)} +
          • {c}
            • + {/each} +
          diff --git a/test/runtime/samples/each-block-keyed-else/_config.js b/test/runtime/samples/each-block-keyed-else/_config.js new file mode 100644 index 0000000000..a5bf722a80 --- /dev/null +++ b/test/runtime/samples/each-block-keyed-else/_config.js @@ -0,0 +1,37 @@ +export default { + props: { + animals: ['alpaca', 'baboon', 'capybara'], + foo: 'something else' + }, + + html: ` + before +

          alpaca

          +

          baboon

          +

          capybara

          + after + `, + + test({ assert, component, target }) { + component.animals = []; + assert.htmlEqual(target.innerHTML, ` + before +

          no animals, but rather something else

          + after + `); + + component.foo = 'something other'; + assert.htmlEqual(target.innerHTML, ` + before +

          no animals, but rather something other

          + after + `); + + component.animals = ['wombat']; + assert.htmlEqual(target.innerHTML, ` + before +

          wombat

          + after + `); + } +}; diff --git a/test/runtime/samples/each-block-keyed-else/main.svelte b/test/runtime/samples/each-block-keyed-else/main.svelte new file mode 100644 index 0000000000..2a82653ff1 --- /dev/null +++ b/test/runtime/samples/each-block-keyed-else/main.svelte @@ -0,0 +1,12 @@ + + +before +{#each animals as animal (animal)} +

          {animal}

          +{:else} +

          no animals, but rather {foo}

          +{/each} +after diff --git a/test/runtime/samples/each-block-keyed-empty/_config.js b/test/runtime/samples/each-block-keyed-empty/_config.js index cf8f4d3219..2c9055ce44 100644 --- a/test/runtime/samples/each-block-keyed-empty/_config.js +++ b/test/runtime/samples/each-block-keyed-empty/_config.js @@ -1,6 +1,6 @@ export default { props: { - x: [{ z: 1 }, { z: 2 }], + x: [{ z: 1 }, { z: 2 }] }, html: `` diff --git a/test/runtime/samples/each-block-keyed-non-prop/_config.js b/test/runtime/samples/each-block-keyed-non-prop/_config.js index 90e9a7f9c8..2cccbedef0 100644 --- a/test/runtime/samples/each-block-keyed-non-prop/_config.js +++ b/test/runtime/samples/each-block-keyed-non-prop/_config.js @@ -25,5 +25,5 @@ export default { assert.equal(p1, p4, 'first

          element should be retained'); assert.equal(p3, p5, 'last

          element should be retained'); - }, + } }; diff --git a/test/runtime/samples/each-block-keyed-random-permute/_config.js b/test/runtime/samples/each-block-keyed-random-permute/_config.js index 80bf2d9115..4e6830a616 100644 --- a/test/runtime/samples/each-block-keyed-random-permute/_config.js +++ b/test/runtime/samples/each-block-keyed-random-permute/_config.js @@ -19,7 +19,7 @@ function permute() { export default { props: { - values: toObjects('abc'), + values: toObjects('abc') }, html: `(a)(b)(c)`, diff --git a/test/runtime/samples/each-block-keyed-shift/_config.js b/test/runtime/samples/each-block-keyed-shift/_config.js index 44ca8447f0..4e7809445c 100644 --- a/test/runtime/samples/each-block-keyed-shift/_config.js +++ b/test/runtime/samples/each-block-keyed-shift/_config.js @@ -1,6 +1,6 @@ export default { props: { - titles: [{ name: 'a', }, { name: 'b' }, { name: 'c' }] + titles: [{ name: 'a' }, { name: 'b' }, { name: 'c' }] }, html: ` diff --git a/test/runtime/samples/each-block-keyed-siblings/_config.js b/test/runtime/samples/each-block-keyed-siblings/_config.js index d87f8943da..a52b6c404d 100644 --- a/test/runtime/samples/each-block-keyed-siblings/_config.js +++ b/test/runtime/samples/each-block-keyed-siblings/_config.js @@ -1,7 +1,7 @@ export default { props: { ones: [{ text: '1' }], - twos: [{ text: '2' }], + twos: [{ text: '2' }] }, html: ` @@ -16,5 +16,5 @@ export default {

          11
          2
          `); - }, + } }; diff --git a/test/runtime/samples/each-block-keyed-static/_config.js b/test/runtime/samples/each-block-keyed-static/_config.js index 629ea47ebb..57800c454f 100644 --- a/test/runtime/samples/each-block-keyed-static/_config.js +++ b/test/runtime/samples/each-block-keyed-static/_config.js @@ -1,6 +1,6 @@ export default { props: { - x: [{ z: 1 }, { z: 2 }], + x: [{ z: 1 }, { z: 2 }] }, html: ` diff --git a/test/runtime/samples/each-block-scope-shadow-bind-2/_config.js b/test/runtime/samples/each-block-scope-shadow-bind-2/_config.js new file mode 100644 index 0000000000..384c2dd2b4 --- /dev/null +++ b/test/runtime/samples/each-block-scope-shadow-bind-2/_config.js @@ -0,0 +1,23 @@ +export default { + html: ` + Hello + + `, + ssrHtml: ` + Hello + + `, + async test({ assert, target, window }) { + const input = target.querySelector("input"); + input.value = "abcd"; + await input.dispatchEvent(new window.Event("input")); + + assert.htmlEqual( + target.innerHTML, + ` + abcd + + ` + ); + } +}; diff --git a/test/runtime/samples/each-block-scope-shadow-bind-2/main.svelte b/test/runtime/samples/each-block-scope-shadow-bind-2/main.svelte new file mode 100644 index 0000000000..f5bff01e6c --- /dev/null +++ b/test/runtime/samples/each-block-scope-shadow-bind-2/main.svelte @@ -0,0 +1,10 @@ + + +{#each a as { a }} + {a} + +{/each} \ No newline at end of file diff --git a/test/runtime/samples/each-block-scope-shadow-bind-3/_config.js b/test/runtime/samples/each-block-scope-shadow-bind-3/_config.js new file mode 100644 index 0000000000..92230a735c --- /dev/null +++ b/test/runtime/samples/each-block-scope-shadow-bind-3/_config.js @@ -0,0 +1,105 @@ +export default { + html: ` +
          + Hello World + + +
          +
          + Sapper App + + +
          + `, + + ssrHtml: ` +
          + Hello World + + +
          +
          + Sapper App + + +
          + `, + async test({ assert, target, window }) { + const [input1, input2, input3, input4] = target.querySelectorAll("input"); + input1.value = "Awesome"; + await input1.dispatchEvent(new window.Event("input")); + + assert.htmlEqual( + target.innerHTML, + ` +
          + Awesome World + + +
          +
          + Sapper App + + +
          + ` + ); + + input2.value = "Svelte"; + await input2.dispatchEvent(new window.Event("input")); + + assert.htmlEqual( + target.innerHTML, + ` +
          + Awesome Svelte + + +
          +
          + Sapper App + + +
          + ` + ); + + input3.value = "Foo"; + await input3.dispatchEvent(new window.Event("input")); + + assert.htmlEqual( + target.innerHTML, + ` +
          + Awesome Svelte + + +
          +
          + Foo App + + +
          + ` + ); + + input4.value = "Bar"; + await input4.dispatchEvent(new window.Event("input")); + + assert.htmlEqual( + target.innerHTML, + ` +
          + Awesome Svelte + + +
          +
          + Foo Bar + + +
          + ` + ); + } +}; diff --git a/test/runtime/samples/each-block-scope-shadow-bind-3/main.svelte b/test/runtime/samples/each-block-scope-shadow-bind-3/main.svelte new file mode 100644 index 0000000000..2e8fe5e591 --- /dev/null +++ b/test/runtime/samples/each-block-scope-shadow-bind-3/main.svelte @@ -0,0 +1,14 @@ + + +{#each a as a} +
          + {a[0]} {a[1]} + + +
          +{/each} \ No newline at end of file diff --git a/test/runtime/samples/each-block-scope-shadow-bind-4/_config.js b/test/runtime/samples/each-block-scope-shadow-bind-4/_config.js new file mode 100644 index 0000000000..418fcbea4a --- /dev/null +++ b/test/runtime/samples/each-block-scope-shadow-bind-4/_config.js @@ -0,0 +1,64 @@ +export default { + html: ` +
          + b: Hello + +
          + + `, + ssrHtml: ` +
          + b: Hello + +
          + + `, + async test({ assert, target, window }) { + const input = target.querySelector("input"); + const button = target.querySelector("button"); + + input.value = "Awesome"; + await input.dispatchEvent(new window.Event("input")); + + assert.htmlEqual( + target.innerHTML, + ` +
          + b: Awesome + +
          + + ` + ); + + + await button.dispatchEvent(new window.MouseEvent("click")); + + assert.htmlEqual( + target.innerHTML, + ` +
          + c: World + +
          + + ` + ); + + assert.equal(input.value, 'World'); + + input.value = "Svelte"; + await input.dispatchEvent(new window.Event("input")); + + assert.htmlEqual( + target.innerHTML, + ` +
          + c: Svelte + +
          + + ` + ); + } +}; diff --git a/test/runtime/samples/each-block-scope-shadow-bind-4/main.svelte b/test/runtime/samples/each-block-scope-shadow-bind-4/main.svelte new file mode 100644 index 0000000000..bc4f172dd0 --- /dev/null +++ b/test/runtime/samples/each-block-scope-shadow-bind-4/main.svelte @@ -0,0 +1,14 @@ + + +{#each a as { a, key }} +
          + {key}: {a[key]} + +
          +{/each} + + \ No newline at end of file diff --git a/test/runtime/samples/each-block-scope-shadow-bind/_config.js b/test/runtime/samples/each-block-scope-shadow-bind/_config.js new file mode 100644 index 0000000000..384c2dd2b4 --- /dev/null +++ b/test/runtime/samples/each-block-scope-shadow-bind/_config.js @@ -0,0 +1,23 @@ +export default { + html: ` + Hello + + `, + ssrHtml: ` + Hello + + `, + async test({ assert, target, window }) { + const input = target.querySelector("input"); + input.value = "abcd"; + await input.dispatchEvent(new window.Event("input")); + + assert.htmlEqual( + target.innerHTML, + ` + abcd + + ` + ); + } +}; diff --git a/test/runtime/samples/each-block-scope-shadow-bind/main.svelte b/test/runtime/samples/each-block-scope-shadow-bind/main.svelte new file mode 100644 index 0000000000..f3471e179f --- /dev/null +++ b/test/runtime/samples/each-block-scope-shadow-bind/main.svelte @@ -0,0 +1,10 @@ + + +{#each a as a} + {a} + +{/each} \ No newline at end of file diff --git a/test/runtime/samples/each-block-scope-shadow-self/_config.js b/test/runtime/samples/each-block-scope-shadow-self/_config.js index 1669dc5b6e..867aadfab9 100644 --- a/test/runtime/samples/each-block-scope-shadow-self/_config.js +++ b/test/runtime/samples/each-block-scope-shadow-self/_config.js @@ -9,5 +9,5 @@ export default { assert.equal(target.querySelectorAll('input').length, 3); assert.deepEqual(component.data, { a: 'svelte', b: 'B', c: 'C' }); assert.deepEqual(component.x, ['a', 'b', 'c']); - }, + } }; diff --git a/test/runtime/samples/each-block-string/_config.js b/test/runtime/samples/each-block-string/_config.js new file mode 100644 index 0000000000..7366c964eb --- /dev/null +++ b/test/runtime/samples/each-block-string/_config.js @@ -0,0 +1,10 @@ +export default { + compileOptions: { + dev: true + }, + html: ` +
          f
          +
          o
          +
          o
          + ` +}; diff --git a/test/runtime/samples/each-block-string/main.svelte b/test/runtime/samples/each-block-string/main.svelte new file mode 100644 index 0000000000..ae60f0f6b3 --- /dev/null +++ b/test/runtime/samples/each-block-string/main.svelte @@ -0,0 +1,3 @@ +{#each 'foo' as c} +
          {c}
          +{/each} diff --git a/test/runtime/samples/each-block-unkeyed-else-2/_config.js b/test/runtime/samples/each-block-unkeyed-else-2/_config.js new file mode 100644 index 0000000000..a5bf722a80 --- /dev/null +++ b/test/runtime/samples/each-block-unkeyed-else-2/_config.js @@ -0,0 +1,37 @@ +export default { + props: { + animals: ['alpaca', 'baboon', 'capybara'], + foo: 'something else' + }, + + html: ` + before +

          alpaca

          +

          baboon

          +

          capybara

          + after + `, + + test({ assert, component, target }) { + component.animals = []; + assert.htmlEqual(target.innerHTML, ` + before +

          no animals, but rather something else

          + after + `); + + component.foo = 'something other'; + assert.htmlEqual(target.innerHTML, ` + before +

          no animals, but rather something other

          + after + `); + + component.animals = ['wombat']; + assert.htmlEqual(target.innerHTML, ` + before +

          wombat

          + after + `); + } +}; diff --git a/test/runtime/samples/each-block-unkeyed-else-2/main.svelte b/test/runtime/samples/each-block-unkeyed-else-2/main.svelte new file mode 100644 index 0000000000..3275cb1f83 --- /dev/null +++ b/test/runtime/samples/each-block-unkeyed-else-2/main.svelte @@ -0,0 +1,12 @@ + + +before +{#each animals as animal} +

          {animal}

          +{:else} +

          no animals, but rather {foo}

          +{/each} +after diff --git a/test/runtime/samples/each-blocks-assignment-2/_config.js b/test/runtime/samples/each-blocks-assignment-2/_config.js new file mode 100644 index 0000000000..0831617261 --- /dev/null +++ b/test/runtime/samples/each-blocks-assignment-2/_config.js @@ -0,0 +1,20 @@ +export default { + html: ` + foo + + `, + async test({ assert, component, target, window }) { + const button = target.querySelector("button"); + + const clickEvent = new window.MouseEvent("click"); + await button.dispatchEvent(clickEvent); + + assert.htmlEqual( + target.innerHTML, + ` + bar + + ` + ); + } +}; diff --git a/test/runtime/samples/each-blocks-assignment-2/main.svelte b/test/runtime/samples/each-blocks-assignment-2/main.svelte new file mode 100644 index 0000000000..5ef3ae83ac --- /dev/null +++ b/test/runtime/samples/each-blocks-assignment-2/main.svelte @@ -0,0 +1,12 @@ + + +{#each arr as o} + {o.prop} + +{/each} \ No newline at end of file diff --git a/test/runtime/samples/each-blocks-assignment/_config.js b/test/runtime/samples/each-blocks-assignment/_config.js new file mode 100644 index 0000000000..2c95d486d6 --- /dev/null +++ b/test/runtime/samples/each-blocks-assignment/_config.js @@ -0,0 +1,97 @@ +export default { + html: ` + + 1 + + 2 + + 3 + + `, + async test({ assert, component, target, window }) { + let [incrementBtn, ...buttons] = target.querySelectorAll("button"); + + const clickEvent = new window.MouseEvent("click"); + await buttons[0].dispatchEvent(clickEvent); + + assert.htmlEqual( + target.innerHTML, + ` + + 2 + + 2 + + 3 + + ` + ); + + await buttons[0].dispatchEvent(clickEvent); + + assert.htmlEqual( + target.innerHTML, + ` + + 4 + + 2 + + 3 + + ` + ); + + await buttons[2].dispatchEvent(clickEvent); + await buttons[2].dispatchEvent(clickEvent); + + assert.htmlEqual( + target.innerHTML, + ` + + 4 + + 2 + + 12 + + ` + ); + + await incrementBtn.dispatchEvent(clickEvent); + + assert.htmlEqual( + target.innerHTML, + ` + + 4 + + 2 + + 12 + + 4 + + ` + ); + + [incrementBtn, ...buttons] = target.querySelectorAll("button"); + + await buttons[3].dispatchEvent(clickEvent); + + assert.htmlEqual( + target.innerHTML, + ` + + 4 + + 2 + + 12 + + 8 + + ` + ); + } +}; diff --git a/test/runtime/samples/each-blocks-assignment/main.svelte b/test/runtime/samples/each-blocks-assignment/main.svelte new file mode 100644 index 0000000000..f74bffbe04 --- /dev/null +++ b/test/runtime/samples/each-blocks-assignment/main.svelte @@ -0,0 +1,13 @@ + + + +{#each arr as o} + {o} + +{/each} \ No newline at end of file diff --git a/test/runtime/samples/empty-dom/_config.js b/test/runtime/samples/empty-dom/_config.js index e3e3d0ecd5..7da2831db4 100644 --- a/test/runtime/samples/empty-dom/_config.js +++ b/test/runtime/samples/empty-dom/_config.js @@ -1,3 +1,3 @@ export default { - html: '', + html: '' }; \ No newline at end of file diff --git a/test/runtime/samples/empty-style-block/_config.js b/test/runtime/samples/empty-style-block/_config.js index 0375bad029..22dc25b41e 100644 --- a/test/runtime/samples/empty-style-block/_config.js +++ b/test/runtime/samples/empty-style-block/_config.js @@ -1,3 +1,3 @@ export default { - html: '', + html: '' }; diff --git a/test/runtime/samples/escape-template-literals/_config.js b/test/runtime/samples/escape-template-literals/_config.js index 1419d65679..9e50f94764 100644 --- a/test/runtime/samples/escape-template-literals/_config.js +++ b/test/runtime/samples/escape-template-literals/_config.js @@ -1,3 +1,3 @@ export default { - html: '`${foo}\\n`\n
          foo
          \n
          `${foo}\\n`
          ', + html: '`${foo}\\n`\n
          foo
          \n
          `${foo}\\n`
          ' }; diff --git a/test/runtime/samples/event-handler-async/_config.js b/test/runtime/samples/event-handler-async/_config.js index fab4d998b6..b483d039ed 100644 --- a/test/runtime/samples/event-handler-async/_config.js +++ b/test/runtime/samples/event-handler-async/_config.js @@ -1,5 +1,5 @@ export default { html: ` - `, + ` }; diff --git a/test/runtime/samples/event-handler-dynamic-2/_config.js b/test/runtime/samples/event-handler-dynamic-2/_config.js new file mode 100644 index 0000000000..5fded47855 --- /dev/null +++ b/test/runtime/samples/event-handler-dynamic-2/_config.js @@ -0,0 +1,33 @@ +export default { + html: ` + +

          0

          + + + `, + + async test({ assert, target, window }) { + const [toggle, handler_a, handler_b] = target.querySelectorAll('button'); + const p = target.querySelector('p'); + + const event = new window.MouseEvent('click'); + + await handler_a.dispatchEvent(event); + assert.equal(p.innerHTML, '1'); + + await toggle.dispatchEvent(event); + + await handler_a.dispatchEvent(event); + assert.equal(p.innerHTML, '2'); + + await toggle.dispatchEvent(event); + + await handler_b.dispatchEvent(event); + assert.equal(p.innerHTML, '1'); + + await toggle.dispatchEvent(event); + + await handler_b.dispatchEvent(event); + assert.equal(p.innerHTML, '2'); + } +}; diff --git a/test/runtime/samples/event-handler-dynamic-2/main.svelte b/test/runtime/samples/event-handler-dynamic-2/main.svelte new file mode 100644 index 0000000000..1b2041d3b8 --- /dev/null +++ b/test/runtime/samples/event-handler-dynamic-2/main.svelte @@ -0,0 +1,20 @@ + + + + +

          {number}

          + + + diff --git a/test/runtime/samples/event-handler-dynamic-bound-var/_config.js b/test/runtime/samples/event-handler-dynamic-bound-var/_config.js index c832127c09..c490db000a 100644 --- a/test/runtime/samples/event-handler-dynamic-bound-var/_config.js +++ b/test/runtime/samples/event-handler-dynamic-bound-var/_config.js @@ -16,5 +16,5 @@ export default { Bye World ` ); - }, + } }; diff --git a/test/runtime/samples/event-handler-dynamic-expression/_config.js b/test/runtime/samples/event-handler-dynamic-expression/_config.js index c4d259a542..b202196ebf 100644 --- a/test/runtime/samples/event-handler-dynamic-expression/_config.js +++ b/test/runtime/samples/event-handler-dynamic-expression/_config.js @@ -16,5 +16,5 @@ export default { await button.dispatchEvent(event); assert.htmlEqual(target.innerHTML, ``); - }, + } }; diff --git a/test/runtime/samples/event-handler-dynamic-hash/_config.js b/test/runtime/samples/event-handler-dynamic-hash/_config.js index e60e561524..dcfebb7008 100644 --- a/test/runtime/samples/event-handler-dynamic-hash/_config.js +++ b/test/runtime/samples/event-handler-dynamic-hash/_config.js @@ -52,5 +52,5 @@ export default {

          2

          `); - }, + } }; diff --git a/test/runtime/samples/event-handler-dynamic-invalid/_config.js b/test/runtime/samples/event-handler-dynamic-invalid/_config.js index ba1777f945..ad9d8c8680 100644 --- a/test/runtime/samples/event-handler-dynamic-invalid/_config.js +++ b/test/runtime/samples/event-handler-dynamic-invalid/_config.js @@ -24,5 +24,5 @@ export default { await buttonInvalid.dispatchEvent(event); assert.equal(err, "", err); - }, + } }; diff --git a/test/runtime/samples/event-handler-dynamic-modifier-self/_config.js b/test/runtime/samples/event-handler-dynamic-modifier-self/_config.js index 6d7d29e482..6bd96ba8aa 100644 --- a/test/runtime/samples/event-handler-dynamic-modifier-self/_config.js +++ b/test/runtime/samples/event-handler-dynamic-modifier-self/_config.js @@ -12,5 +12,5 @@ export default { await button.dispatchEvent(event); assert.ok(!component.inner_clicked); - }, + } }; diff --git a/test/runtime/samples/event-handler-dynamic/_config.js b/test/runtime/samples/event-handler-dynamic/_config.js index e60e561524..dcfebb7008 100644 --- a/test/runtime/samples/event-handler-dynamic/_config.js +++ b/test/runtime/samples/event-handler-dynamic/_config.js @@ -52,5 +52,5 @@ export default {

          2

          `); - }, + } }; diff --git a/test/runtime/samples/event-handler-each-modifier/_config.js b/test/runtime/samples/event-handler-each-modifier/_config.js new file mode 100644 index 0000000000..702addd3c3 --- /dev/null +++ b/test/runtime/samples/event-handler-each-modifier/_config.js @@ -0,0 +1,42 @@ +export default { + async test({ assert, component, target, window }) { + // set first + await component.lists.update(() => [ + { text: "item1" }, + { text: "item2" }, + { text: "item3" } + ]); + + await component.lists.update(() => [ + { text: "item3" }, + { text: "item2" }, + { text: "item1" } + ]); + + await component.lists.update(() => [ + { text: "item1" }, + { text: "item2" }, + { text: "item3" } + ]); + + assert.equal(component.updated, 4); + + const [item1, item2] = target.childNodes; + const [item1Btn1, item1Btn2] = item1.querySelectorAll('button'); + const [item2Btn1, item2Btn2] = item2.querySelectorAll('button'); + + const clickEvent = new window.MouseEvent('click'); + + await item1Btn1.dispatchEvent(clickEvent); + assert.equal(component.getNormalCount(), 1); + + await item1Btn2.dispatchEvent(clickEvent); + assert.equal(component.getModifierCount(), 1); + + await item2Btn1.dispatchEvent(clickEvent); + assert.equal(component.getNormalCount(), 2); + + await item2Btn2.dispatchEvent(clickEvent); + assert.equal(component.getModifierCount(), 2); + } +}; diff --git a/test/runtime/samples/event-handler-each-modifier/main.svelte b/test/runtime/samples/event-handler-each-modifier/main.svelte new file mode 100644 index 0000000000..ca7447f728 --- /dev/null +++ b/test/runtime/samples/event-handler-each-modifier/main.svelte @@ -0,0 +1,37 @@ + + +{#each $lists as item (item.text)} +
          + {item.text} + + +
          +{/each} diff --git a/test/runtime/samples/event-handler-each-this/_config.js b/test/runtime/samples/event-handler-each-this/_config.js index 3ab2d5acdc..7f6528977c 100644 --- a/test/runtime/samples/event-handler-each-this/_config.js +++ b/test/runtime/samples/event-handler-each-this/_config.js @@ -1,6 +1,6 @@ export default { props: { - items: ['foo', 'bar', 'baz'], + items: ['foo', 'bar', 'baz'] }, html: ` diff --git a/test/runtime/samples/event-handler-modifier-self/_config.js b/test/runtime/samples/event-handler-modifier-self/_config.js index 6d7d29e482..6bd96ba8aa 100644 --- a/test/runtime/samples/event-handler-modifier-self/_config.js +++ b/test/runtime/samples/event-handler-modifier-self/_config.js @@ -12,5 +12,5 @@ export default { await button.dispatchEvent(event); assert.ok(!component.inner_clicked); - }, + } }; diff --git a/test/runtime/samples/globals-not-overwritten-by-bindings/_config.js b/test/runtime/samples/globals-not-overwritten-by-bindings/_config.js index d5f3def7f1..34cee8157c 100644 --- a/test/runtime/samples/globals-not-overwritten-by-bindings/_config.js +++ b/test/runtime/samples/globals-not-overwritten-by-bindings/_config.js @@ -37,17 +37,17 @@ export default { todos: { first: { description: 'Buy some milk', - done: true, + done: true }, second: { description: 'Do the laundry', - done: true, + done: true }, third: { description: "Find life's true purpose", - done: false, - }, - }, + done: false + } + } }, async test({ assert, component, target, window }) { @@ -74,5 +74,5 @@ export default {
          `); - }, + } }; diff --git a/test/runtime/samples/globals-shadowed-by-each-binding/_config.js b/test/runtime/samples/globals-shadowed-by-each-binding/_config.js index f69e5e8b0e..50feb09bb6 100644 --- a/test/runtime/samples/globals-shadowed-by-each-binding/_config.js +++ b/test/runtime/samples/globals-shadowed-by-each-binding/_config.js @@ -1,3 +1,3 @@ export default { - html: '

          Alert1

          Alert2

          ', + html: '

          Alert1

          Alert2

          ' }; diff --git a/test/runtime/samples/if-block-component-store-function-conditionals/_config.js b/test/runtime/samples/if-block-component-store-function-conditionals/_config.js index db171f2fd1..609765d225 100644 --- a/test/runtime/samples/if-block-component-store-function-conditionals/_config.js +++ b/test/runtime/samples/if-block-component-store-function-conditionals/_config.js @@ -1,3 +1,3 @@ export default { - html: '

          OK

          ', + html: '

          OK

          ' }; diff --git a/test/runtime/samples/if-block-component-without-outro/_config.js b/test/runtime/samples/if-block-component-without-outro/_config.js index 8106081c7c..fbcc328fa3 100644 --- a/test/runtime/samples/if-block-component-without-outro/_config.js +++ b/test/runtime/samples/if-block-component-without-outro/_config.js @@ -1,6 +1,6 @@ export default { props: { - foo: true, + foo: true }, html: '
          A wild component appears
          ', @@ -8,5 +8,5 @@ export default { test({ assert, component, target }) { component.foo = false; assert.htmlEqual(target.innerHTML, ''); - }, + } }; diff --git a/test/runtime/samples/if-block-else-in-each/_config.js b/test/runtime/samples/if-block-else-in-each/_config.js index 44268f32b9..e75dcb15ee 100644 --- a/test/runtime/samples/if-block-else-in-each/_config.js +++ b/test/runtime/samples/if-block-else-in-each/_config.js @@ -1,9 +1,9 @@ export default { props: { - array: [true, false], + array: [true, false] }, html: `
          foo
          bar
          - `, + ` }; diff --git a/test/runtime/samples/if-block-else-partial-outro/_config.js b/test/runtime/samples/if-block-else-partial-outro/_config.js index a358680edf..ae58d25c23 100644 --- a/test/runtime/samples/if-block-else-partial-outro/_config.js +++ b/test/runtime/samples/if-block-else-partial-outro/_config.js @@ -1,7 +1,7 @@ export default { props: { x: 1, - y: false, + y: false }, html: ` @@ -13,5 +13,5 @@ export default { assert.htmlEqual(target.innerHTML, ` 2 `); - }, + } }; diff --git a/test/runtime/samples/if-block-no-outro-else-with-outro/_config.js b/test/runtime/samples/if-block-no-outro-else-with-outro/_config.js index b2e71ea01f..da80f5be12 100644 --- a/test/runtime/samples/if-block-no-outro-else-with-outro/_config.js +++ b/test/runtime/samples/if-block-no-outro-else-with-outro/_config.js @@ -18,5 +18,5 @@ export default {

          y

          `); - }, + } }; diff --git a/test/runtime/samples/if-block-outro-unique-select-block-type/_config.js b/test/runtime/samples/if-block-outro-unique-select-block-type/_config.js index b94da1a576..15213e19b3 100644 --- a/test/runtime/samples/if-block-outro-unique-select-block-type/_config.js +++ b/test/runtime/samples/if-block-outro-unique-select-block-type/_config.js @@ -2,5 +2,5 @@ export default { html: `
          - `, + ` }; diff --git a/test/runtime/samples/if-block-static-with-elseif-else-and-outros/RRR.svelte b/test/runtime/samples/if-block-static-with-elseif-else-and-outros/RRR.svelte new file mode 100644 index 0000000000..7242373249 --- /dev/null +++ b/test/runtime/samples/if-block-static-with-elseif-else-and-outros/RRR.svelte @@ -0,0 +1 @@ +rrr \ No newline at end of file diff --git a/test/runtime/samples/if-block-static-with-elseif-else-and-outros/_config.js b/test/runtime/samples/if-block-static-with-elseif-else-and-outros/_config.js new file mode 100644 index 0000000000..8b2c6d2d66 --- /dev/null +++ b/test/runtime/samples/if-block-static-with-elseif-else-and-outros/_config.js @@ -0,0 +1,3 @@ +export default { + html: 'eee' +}; diff --git a/test/runtime/samples/if-block-static-with-elseif-else-and-outros/main.svelte b/test/runtime/samples/if-block-static-with-elseif-else-and-outros/main.svelte new file mode 100644 index 0000000000..b60885722e --- /dev/null +++ b/test/runtime/samples/if-block-static-with-elseif-else-and-outros/main.svelte @@ -0,0 +1,13 @@ + + +{#if "Eva".startsWith('E')} + eee +{:else if x} + def +{:else} + +{/if} diff --git a/test/runtime/samples/initial-state-assign/_config.js b/test/runtime/samples/initial-state-assign/_config.js index b4067fef80..95a1a5e068 100644 --- a/test/runtime/samples/initial-state-assign/_config.js +++ b/test/runtime/samples/initial-state-assign/_config.js @@ -3,5 +3,5 @@ export default { html: ` "foo" "bar" - `, + ` }; diff --git a/test/runtime/samples/innerhtml-with-comments/_config.js b/test/runtime/samples/innerhtml-with-comments/_config.js new file mode 100644 index 0000000000..95d4a6fa96 --- /dev/null +++ b/test/runtime/samples/innerhtml-with-comments/_config.js @@ -0,0 +1,8 @@ +export default { + html: ` + + Style: + Bootstrap. + + ` +}; \ No newline at end of file diff --git a/test/runtime/samples/innerhtml-with-comments/main.svelte b/test/runtime/samples/innerhtml-with-comments/main.svelte new file mode 100644 index 0000000000..e00f755072 --- /dev/null +++ b/test/runtime/samples/innerhtml-with-comments/main.svelte @@ -0,0 +1,5 @@ + + Style: + + Bootstrap. + \ No newline at end of file diff --git a/test/runtime/samples/instrumentation-update-expression/_config.js b/test/runtime/samples/instrumentation-update-expression/_config.js new file mode 100644 index 0000000000..cc33422f6f --- /dev/null +++ b/test/runtime/samples/instrumentation-update-expression/_config.js @@ -0,0 +1,31 @@ +export default { + html: ` +

          0

          + + +

          0

          + + + `, + async test({ assert, target, window }) { + const [foo, bar] = target.querySelectorAll('p'); + const [button1, button2, button3, button4] = target.querySelectorAll('button'); + const event = new window.MouseEvent('click'); + + await button1.dispatchEvent(event); + assert.equal(foo.innerHTML, '1'); + assert.equal(bar.innerHTML, '0'); + + await button2.dispatchEvent(event); + assert.equal(foo.innerHTML, '2'); + assert.equal(bar.innerHTML, '0'); + + await button3.dispatchEvent(event); + assert.equal(foo.innerHTML, '2'); + assert.equal(bar.innerHTML, '1'); + + await button4.dispatchEvent(event); + assert.equal(foo.innerHTML, '2'); + assert.equal(bar.innerHTML, '2'); + } +}; diff --git a/test/runtime/samples/instrumentation-update-expression/main.svelte b/test/runtime/samples/instrumentation-update-expression/main.svelte new file mode 100644 index 0000000000..0672f6330d --- /dev/null +++ b/test/runtime/samples/instrumentation-update-expression/main.svelte @@ -0,0 +1,14 @@ + + +

          {foo}

          + + + + +

          {bar.bar}

          + + + diff --git a/test/runtime/samples/key-block-2/_config.js b/test/runtime/samples/key-block-2/_config.js new file mode 100644 index 0000000000..a7c53bd91f --- /dev/null +++ b/test/runtime/samples/key-block-2/_config.js @@ -0,0 +1,14 @@ +// with reactive content beside `key` +export default { + html: `
          00
          `, + async test({ assert, component, target, window }) { + const div = target.querySelector('div'); + component.reactive = 2; + assert.htmlEqual(target.innerHTML, `
          02
          `); + assert.strictEqual(div, target.querySelector('div')); + + component.value = 5; + assert.htmlEqual(target.innerHTML, `
          52
          `); + assert.notStrictEqual(div, target.querySelector('div')); + } +}; diff --git a/test/runtime/samples/key-block-2/main.svelte b/test/runtime/samples/key-block-2/main.svelte new file mode 100644 index 0000000000..466d20b10a --- /dev/null +++ b/test/runtime/samples/key-block-2/main.svelte @@ -0,0 +1,8 @@ + + +{#key value} +
          {value}{reactive}
          +{/key} \ No newline at end of file diff --git a/test/runtime/samples/key-block-3/_config.js b/test/runtime/samples/key-block-3/_config.js new file mode 100644 index 0000000000..4290599cb3 --- /dev/null +++ b/test/runtime/samples/key-block-3/_config.js @@ -0,0 +1,11 @@ +// key is not used in the template +export default { + html: `
          `, + async test({ assert, component, target, window }) { + const div = target.querySelector('div'); + + component.value = 5; + assert.htmlEqual(target.innerHTML, `
          `); + assert.notStrictEqual(div, target.querySelector('div')); + } +}; diff --git a/test/runtime/samples/key-block-3/main.svelte b/test/runtime/samples/key-block-3/main.svelte new file mode 100644 index 0000000000..1ed185c732 --- /dev/null +++ b/test/runtime/samples/key-block-3/main.svelte @@ -0,0 +1,7 @@ + + +{#key value} +
          +{/key} \ No newline at end of file diff --git a/test/runtime/samples/key-block-array-immutable/_config.js b/test/runtime/samples/key-block-array-immutable/_config.js new file mode 100644 index 0000000000..fb94556c0f --- /dev/null +++ b/test/runtime/samples/key-block-array-immutable/_config.js @@ -0,0 +1,15 @@ +export default { + html: `
          1
          `, + async test({ assert, component, target, window }) { + let div = target.querySelector("div"); + await component.append(2); + assert.htmlEqual(target.innerHTML, `
          1
          `); + assert.strictEqual(div, target.querySelector("div")); + + div = target.querySelector("div"); + + component.array = [3, 4]; + assert.htmlEqual(target.innerHTML, `
          3,4
          `); + assert.notStrictEqual(div, target.querySelector("div")); + } +}; diff --git a/test/runtime/samples/key-block-array-immutable/main.svelte b/test/runtime/samples/key-block-array-immutable/main.svelte new file mode 100644 index 0000000000..e666275af4 --- /dev/null +++ b/test/runtime/samples/key-block-array-immutable/main.svelte @@ -0,0 +1,14 @@ + + + + +{#key array} +
          {array.join(',')}
          +{/key} \ No newline at end of file diff --git a/test/runtime/samples/key-block-array/_config.js b/test/runtime/samples/key-block-array/_config.js new file mode 100644 index 0000000000..05d5fe9995 --- /dev/null +++ b/test/runtime/samples/key-block-array/_config.js @@ -0,0 +1,15 @@ +export default { + html: `
          1
          `, + async test({ assert, component, target, window }) { + let div = target.querySelector("div"); + await component.append(2); + assert.htmlEqual(target.innerHTML, `
          1,2
          `); + assert.notStrictEqual(div, target.querySelector("div")); + + div = target.querySelector("div"); + + component.array = [3, 4]; + assert.htmlEqual(target.innerHTML, `
          3,4
          `); + assert.notStrictEqual(div, target.querySelector("div")); + } +}; diff --git a/test/runtime/samples/key-block-array/main.svelte b/test/runtime/samples/key-block-array/main.svelte new file mode 100644 index 0000000000..5a4054b043 --- /dev/null +++ b/test/runtime/samples/key-block-array/main.svelte @@ -0,0 +1,12 @@ + + +{#key array} +
          {array.join(',')}
          +{/key} \ No newline at end of file diff --git a/test/runtime/samples/key-block-expression-2/_config.js b/test/runtime/samples/key-block-expression-2/_config.js new file mode 100644 index 0000000000..236c72fa3d --- /dev/null +++ b/test/runtime/samples/key-block-expression-2/_config.js @@ -0,0 +1,18 @@ +export default { + html: `
          3
          `, + async test({ assert, component, target, window }) { + const div = target.querySelector("div"); + + await component.mutate(); + assert.htmlEqual(target.innerHTML, `
          5
          `); + assert.strictEqual(div, target.querySelector("div")); + + await component.reassign(); + assert.htmlEqual(target.innerHTML, `
          7
          `); + assert.strictEqual(div, target.querySelector("div")); + + await component.changeKey(); + assert.htmlEqual(target.innerHTML, `
          7
          `); + assert.notStrictEqual(div, target.querySelector("div")); + } +}; diff --git a/test/runtime/samples/key-block-expression-2/main.svelte b/test/runtime/samples/key-block-expression-2/main.svelte new file mode 100644 index 0000000000..5525f63761 --- /dev/null +++ b/test/runtime/samples/key-block-expression-2/main.svelte @@ -0,0 +1,17 @@ + + +{#key obj.key} +
          {obj.value}
          +{/key} \ No newline at end of file diff --git a/test/runtime/samples/key-block-expression/_config.js b/test/runtime/samples/key-block-expression/_config.js new file mode 100644 index 0000000000..78890988ea --- /dev/null +++ b/test/runtime/samples/key-block-expression/_config.js @@ -0,0 +1,28 @@ +export default { + html: `
          000
          `, + async test({ assert, component, target, window }) { + let div = target.querySelector("div"); + component.value = 2; + assert.htmlEqual(target.innerHTML, `
          200
          `); + assert.notStrictEqual(div, target.querySelector("div")); + + div = target.querySelector("div"); + + component.anotherValue = 5; + assert.htmlEqual(target.innerHTML, `
          250
          `); + assert.notStrictEqual(div, target.querySelector("div")); + + div = target.querySelector("div"); + + component.thirdValue = 9; + assert.htmlEqual(target.innerHTML, `
          259
          `); + assert.strictEqual(div, target.querySelector("div")); + + // make dirty while maintain the value of `value + anotherValue` + // should update the content, but not recreate the elements + await component.$set({ value: 4, anotherValue: 3 }); + + assert.htmlEqual(target.innerHTML, `
          439
          `); + assert.strictEqual(div, target.querySelector("div")); + } +}; diff --git a/test/runtime/samples/key-block-expression/main.svelte b/test/runtime/samples/key-block-expression/main.svelte new file mode 100644 index 0000000000..dd752e8b8f --- /dev/null +++ b/test/runtime/samples/key-block-expression/main.svelte @@ -0,0 +1,9 @@ + + +{#key value + anotherValue} +
          {value}{anotherValue}{thirdValue}
          +{/key} \ No newline at end of file diff --git a/test/runtime/samples/key-block-static/_config.js b/test/runtime/samples/key-block-static/_config.js new file mode 100644 index 0000000000..d5ea0bf687 --- /dev/null +++ b/test/runtime/samples/key-block-static/_config.js @@ -0,0 +1,9 @@ +export default { + html: `
          00
          `, + async test({ assert, component, target, window }) { + const div = target.querySelector('div'); + component.anotherValue = 2; + assert.htmlEqual(target.innerHTML, `
          02
          `); + assert.strictEqual(div, target.querySelector('div')); + } +}; diff --git a/test/runtime/samples/key-block-static/main.svelte b/test/runtime/samples/key-block-static/main.svelte new file mode 100644 index 0000000000..e4ee6b5d71 --- /dev/null +++ b/test/runtime/samples/key-block-static/main.svelte @@ -0,0 +1,8 @@ + + +{#key value} +
          {value}{anotherValue}
          +{/key} \ No newline at end of file diff --git a/test/runtime/samples/key-block-transition/_config.js b/test/runtime/samples/key-block-transition/_config.js new file mode 100644 index 0000000000..53de6b333c --- /dev/null +++ b/test/runtime/samples/key-block-transition/_config.js @@ -0,0 +1,24 @@ +export default { + html: '
          0
          ', + async test({ assert, component, target, window, raf }) { + component.value = 2; + + const [div1, div2] = target.querySelectorAll('div'); + + assert.htmlEqual(div1.outerHTML, '
          0
          '); + assert.htmlEqual(div2.outerHTML, '
          2
          '); + + raf.tick(0); + + assert.equal(div1.foo, 1); + assert.equal(div1.oof, 0); + + assert.equal(div2.foo, 0); + assert.equal(div2.oof, 1); + + raf.tick(200); + + assert.htmlEqual(target.innerHTML, '
          2
          '); + assert.equal(div2, target.querySelector('div')); + } +}; diff --git a/test/runtime/samples/key-block-transition/main.svelte b/test/runtime/samples/key-block-transition/main.svelte new file mode 100644 index 0000000000..d7fb6ec024 --- /dev/null +++ b/test/runtime/samples/key-block-transition/main.svelte @@ -0,0 +1,17 @@ + + +{#key value} +
          {value}
          +{/key} \ No newline at end of file diff --git a/test/runtime/samples/key-block/_config.js b/test/runtime/samples/key-block/_config.js new file mode 100644 index 0000000000..ad206c3b06 --- /dev/null +++ b/test/runtime/samples/key-block/_config.js @@ -0,0 +1,17 @@ +export default { + html: `
          0
          0
          `, + async test({ assert, component, target, window }) { + let [div1, div2] = target.querySelectorAll('div'); + + component.value = 5; + assert.htmlEqual(target.innerHTML, `
          5
          0
          `); + assert.notStrictEqual(div1, target.querySelectorAll('div')[0]); + assert.strictEqual(div2, target.querySelectorAll('div')[1]); + [div1, div2] = target.querySelectorAll('div'); + + component.reactive = 10; + assert.htmlEqual(target.innerHTML, `
          5
          10
          `); + assert.strictEqual(div1, target.querySelectorAll('div')[0]); + assert.strictEqual(div2, target.querySelectorAll('div')[1]); + } +}; diff --git a/test/runtime/samples/key-block/main.svelte b/test/runtime/samples/key-block/main.svelte new file mode 100644 index 0000000000..ac3c340770 --- /dev/null +++ b/test/runtime/samples/key-block/main.svelte @@ -0,0 +1,10 @@ + + +{#key value} +
          {value}
          +{/key} + +
          {reactive}
          \ No newline at end of file diff --git a/test/runtime/samples/keyed-each-dev-unique/_config.js b/test/runtime/samples/keyed-each-dev-unique/_config.js new file mode 100644 index 0000000000..8f46af9d52 --- /dev/null +++ b/test/runtime/samples/keyed-each-dev-unique/_config.js @@ -0,0 +1,7 @@ +export default { + compileOptions: { + dev: true + }, + + error: `Cannot have duplicate keys in a keyed each` +}; diff --git a/test/runtime/samples/keyed-each-dev-unique/main.svelte b/test/runtime/samples/keyed-each-dev-unique/main.svelte new file mode 100644 index 0000000000..870e7beaa1 --- /dev/null +++ b/test/runtime/samples/keyed-each-dev-unique/main.svelte @@ -0,0 +1,7 @@ + + +{#each array as item (item)} + {item} +{/each} diff --git a/test/runtime/samples/lifecycle-onmount-infinite-loop/Child.svelte b/test/runtime/samples/lifecycle-onmount-infinite-loop/Child.svelte new file mode 100644 index 0000000000..ef16875b64 --- /dev/null +++ b/test/runtime/samples/lifecycle-onmount-infinite-loop/Child.svelte @@ -0,0 +1 @@ +Child diff --git a/test/runtime/samples/lifecycle-onmount-infinite-loop/_config.js b/test/runtime/samples/lifecycle-onmount-infinite-loop/_config.js new file mode 100644 index 0000000000..a76a2686ac --- /dev/null +++ b/test/runtime/samples/lifecycle-onmount-infinite-loop/_config.js @@ -0,0 +1,6 @@ +export default { + test({ assert, component }) { + const { count } = component; + assert.deepEqual(count, 1); + } +}; diff --git a/test/runtime/samples/lifecycle-onmount-infinite-loop/main.svelte b/test/runtime/samples/lifecycle-onmount-infinite-loop/main.svelte new file mode 100644 index 0000000000..1fa4263e39 --- /dev/null +++ b/test/runtime/samples/lifecycle-onmount-infinite-loop/main.svelte @@ -0,0 +1,16 @@ + + +
          diff --git a/test/runtime/samples/lifecycle-render-order-for-children/_config.js b/test/runtime/samples/lifecycle-render-order-for-children/_config.js index 033b593aea..d182d5a97e 100644 --- a/test/runtime/samples/lifecycle-render-order-for-children/_config.js +++ b/test/runtime/samples/lifecycle-render-order-for-children/_config.js @@ -21,7 +21,7 @@ export default { '3: onMount', '3: afterUpdate', '0: onMount', - '0: afterUpdate', + '0: afterUpdate' ]); } else { assert.deepEqual(order, [ @@ -40,10 +40,10 @@ export default { '3: onMount', '3: afterUpdate', '0: onMount', - '0: afterUpdate', + '0: afterUpdate' ]); } order.length = 0; - }, + } }; diff --git a/test/runtime/samples/loop-protect-generator-opt-out/_config.js b/test/runtime/samples/loop-protect-generator-opt-out/_config.js new file mode 100644 index 0000000000..0fe83a36db --- /dev/null +++ b/test/runtime/samples/loop-protect-generator-opt-out/_config.js @@ -0,0 +1,6 @@ +export default { + compileOptions: { + dev: true, + loopGuardTimeout: 1 + } +}; diff --git a/test/runtime/samples/loop-protect-generator-opt-out/main.svelte b/test/runtime/samples/loop-protect-generator-opt-out/main.svelte new file mode 100644 index 0000000000..a7aa790681 --- /dev/null +++ b/test/runtime/samples/loop-protect-generator-opt-out/main.svelte @@ -0,0 +1,14 @@ + \ No newline at end of file diff --git a/test/runtime/samples/loop-protect-inner-function/_config.js b/test/runtime/samples/loop-protect-inner-function/_config.js index 862d4f4c0f..1b553e2475 100644 --- a/test/runtime/samples/loop-protect-inner-function/_config.js +++ b/test/runtime/samples/loop-protect-inner-function/_config.js @@ -2,6 +2,6 @@ export default { html: '
          ', compileOptions: { dev: true, - loopGuardTimeout: 100, + loopGuardTimeout: 100 } }; diff --git a/test/runtime/samples/loop-protect/_config.js b/test/runtime/samples/loop-protect/_config.js index 75f75c003d..230bbeb53d 100644 --- a/test/runtime/samples/loop-protect/_config.js +++ b/test/runtime/samples/loop-protect/_config.js @@ -2,6 +2,6 @@ export default { error: 'Infinite loop detected', compileOptions: { dev: true, - loopGuardTimeout: 100, + loopGuardTimeout: 100 } }; diff --git a/test/runtime/samples/module-context-bind/_config.js b/test/runtime/samples/module-context-bind/_config.js new file mode 100644 index 0000000000..32bc9c4ce9 --- /dev/null +++ b/test/runtime/samples/module-context-bind/_config.js @@ -0,0 +1,4 @@ +export default { + skip_if_ssr: true, + html: '
          object
          ' +}; diff --git a/test/runtime/samples/module-context-bind/main.svelte b/test/runtime/samples/module-context-bind/main.svelte new file mode 100644 index 0000000000..1580102bd8 --- /dev/null +++ b/test/runtime/samples/module-context-bind/main.svelte @@ -0,0 +1,11 @@ + + + + +
          {typeof bar}
          diff --git a/test/runtime/samples/nested-transition-detach-each/_config.js b/test/runtime/samples/nested-transition-detach-each/_config.js index e17fe1bc4d..00c2d44048 100644 --- a/test/runtime/samples/nested-transition-detach-each/_config.js +++ b/test/runtime/samples/nested-transition-detach-each/_config.js @@ -35,5 +35,5 @@ export default { raf.tick(0); raf.tick(100); assert.htmlEqual(target.innerHTML, ``); - }, + } }; diff --git a/test/runtime/samples/nested-transition-detach-if-false/_config.js b/test/runtime/samples/nested-transition-detach-if-false/_config.js index d2ae78ffe3..1d42094192 100644 --- a/test/runtime/samples/nested-transition-detach-if-false/_config.js +++ b/test/runtime/samples/nested-transition-detach-if-false/_config.js @@ -20,5 +20,5 @@ export default { a `); - }, + } }; diff --git a/test/runtime/samples/nested-transition-if-block-not-remounted/_config.js b/test/runtime/samples/nested-transition-if-block-not-remounted/_config.js index 6696389e6e..30ff83b39f 100644 --- a/test/runtime/samples/nested-transition-if-block-not-remounted/_config.js +++ b/test/runtime/samples/nested-transition-if-block-not-remounted/_config.js @@ -20,5 +20,5 @@ export default { }; component.value = 'two'; - }, + } }; diff --git a/test/runtime/samples/noscript-removal/_config.js b/test/runtime/samples/noscript-removal/_config.js index 35bdcefd96..709792c14a 100644 --- a/test/runtime/samples/noscript-removal/_config.js +++ b/test/runtime/samples/noscript-removal/_config.js @@ -5,5 +5,5 @@ export default {
          foo
          foo
          foo
          -`, +` }; diff --git a/test/runtime/samples/numeric-seperator/_config.js b/test/runtime/samples/numeric-seperator/_config.js new file mode 100644 index 0000000000..bc6d7c04f3 --- /dev/null +++ b/test/runtime/samples/numeric-seperator/_config.js @@ -0,0 +1,3 @@ +export default { + html: `2048 2048` +}; diff --git a/test/runtime/samples/numeric-seperator/main.svelte b/test/runtime/samples/numeric-seperator/main.svelte new file mode 100644 index 0000000000..e491b8a107 --- /dev/null +++ b/test/runtime/samples/numeric-seperator/main.svelte @@ -0,0 +1,5 @@ + + +{num} {2_048} \ No newline at end of file diff --git a/test/runtime/samples/onmount-get-current-component/_config.js b/test/runtime/samples/onmount-get-current-component/_config.js new file mode 100644 index 0000000000..8f9529de5c --- /dev/null +++ b/test/runtime/samples/onmount-get-current-component/_config.js @@ -0,0 +1,4 @@ +export default { + skip_if_ssr: true, + html: `1` +}; diff --git a/test/runtime/samples/onmount-get-current-component/main.svelte b/test/runtime/samples/onmount-get-current-component/main.svelte new file mode 100644 index 0000000000..de64bc65fa --- /dev/null +++ b/test/runtime/samples/onmount-get-current-component/main.svelte @@ -0,0 +1,16 @@ + + +{gotException} diff --git a/test/runtime/samples/paren-wrapped-expressions/_config.js b/test/runtime/samples/paren-wrapped-expressions/_config.js index 0c757dc854..972dc51cb0 100644 --- a/test/runtime/samples/paren-wrapped-expressions/_config.js +++ b/test/runtime/samples/paren-wrapped-expressions/_config.js @@ -2,7 +2,7 @@ export default { props: { a: 'foo', b: true, - c: [ 1, 2, 3 ], + c: [ 1, 2, 3 ] }, html: ` diff --git a/test/runtime/samples/prop-exports/_config.js b/test/runtime/samples/prop-exports/_config.js index e1620c015f..69a40c4fab 100644 --- a/test/runtime/samples/prop-exports/_config.js +++ b/test/runtime/samples/prop-exports/_config.js @@ -10,7 +10,7 @@ export default { a2: 4, a6: writable(29), for: 'loop', - continue: '...', + continue: '...' }, html: ` diff --git a/test/runtime/samples/props-reactive-only-with-change/Comp.svelte b/test/runtime/samples/props-reactive-only-with-change/Comp.svelte new file mode 100644 index 0000000000..0eaf8a40d4 --- /dev/null +++ b/test/runtime/samples/props-reactive-only-with-change/Comp.svelte @@ -0,0 +1,6 @@ + \ No newline at end of file diff --git a/test/runtime/samples/props-reactive-only-with-change/_config.js b/test/runtime/samples/props-reactive-only-with-change/_config.js new file mode 100644 index 0000000000..d2e86e583d --- /dev/null +++ b/test/runtime/samples/props-reactive-only-with-change/_config.js @@ -0,0 +1,30 @@ +let callbacks = []; + +export default { + props: { + callback: (value) => callbacks.push(value), + val1: "1", + val2: "2" + }, + + before_test() { + callbacks = []; + }, + + async test({ assert, component, target }) { + assert.equal(callbacks.length, 2); + assert.equal(JSON.stringify(callbacks), '["1","2"]'); + + component.val1 = "3"; + assert.equal(callbacks.length, 3); + assert.equal(JSON.stringify(callbacks), '["1","2","1"]'); + + component.val1 = "4"; + assert.equal(callbacks.length, 4); + assert.equal(JSON.stringify(callbacks), '["1","2","1","1"]'); + + component.val2 = "5"; + assert.equal(callbacks.length, 5); + assert.equal(JSON.stringify(callbacks), '["1","2","1","1","2"]'); + } +}; diff --git a/test/runtime/samples/props-reactive-only-with-change/main.svelte b/test/runtime/samples/props-reactive-only-with-change/main.svelte new file mode 100644 index 0000000000..73ddd137f5 --- /dev/null +++ b/test/runtime/samples/props-reactive-only-with-change/main.svelte @@ -0,0 +1,8 @@ + + + + \ No newline at end of file diff --git a/test/runtime/samples/props-reactive-slot/Comp.svelte b/test/runtime/samples/props-reactive-slot/Comp.svelte new file mode 100644 index 0000000000..bf9e12a58a --- /dev/null +++ b/test/runtime/samples/props-reactive-slot/Comp.svelte @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/test/runtime/samples/props-reactive-slot/_config.js b/test/runtime/samples/props-reactive-slot/_config.js new file mode 100644 index 0000000000..8ee6ef69dc --- /dev/null +++ b/test/runtime/samples/props-reactive-slot/_config.js @@ -0,0 +1,21 @@ +export default { + html: ` +

          hi

          + + `, + + async test({ assert, component, target, window }) { + const btn = target.querySelector("button"); + const clickEvent = new window.MouseEvent("click"); + + await btn.dispatchEvent(clickEvent); + + assert.htmlEqual( + target.innerHTML, + ` +

          changed

          + + ` + ); + } +}; diff --git a/test/runtime/samples/props-reactive-slot/main.svelte b/test/runtime/samples/props-reactive-slot/main.svelte new file mode 100644 index 0000000000..84777bf8ab --- /dev/null +++ b/test/runtime/samples/props-reactive-slot/main.svelte @@ -0,0 +1,13 @@ + + + +

          + {props.someprop} +

          +           + + \ No newline at end of file diff --git a/test/runtime/samples/raw-mustache-as-root/RawMustache.svelte b/test/runtime/samples/raw-mustache-as-root/RawMustache.svelte new file mode 100644 index 0000000000..d94954f49b --- /dev/null +++ b/test/runtime/samples/raw-mustache-as-root/RawMustache.svelte @@ -0,0 +1,5 @@ + + +{@html content} \ No newline at end of file diff --git a/test/runtime/samples/raw-mustache-as-root/_config.js b/test/runtime/samples/raw-mustache-as-root/_config.js new file mode 100644 index 0000000000..e42fa7f517 --- /dev/null +++ b/test/runtime/samples/raw-mustache-as-root/_config.js @@ -0,0 +1,33 @@ +export default { + html: ` + +

          Another first line

          +

          This line should be last.

          + `, + async test({ assert, target, window }) { + const btn = target.querySelector("button"); + const clickEvent = new window.MouseEvent("click"); + + await btn.dispatchEvent(clickEvent); + + assert.htmlEqual( + target.innerHTML, + ` + +

          First line

          +

          This line should be last.

          + ` + ); + + await btn.dispatchEvent(clickEvent); + + assert.htmlEqual( + target.innerHTML, + ` + +

          Another first line

          +

          This line should be last.

          + ` + ); + } +}; diff --git a/test/runtime/samples/raw-mustache-as-root/main.svelte b/test/runtime/samples/raw-mustache-as-root/main.svelte new file mode 100644 index 0000000000..7ccce0cd9b --- /dev/null +++ b/test/runtime/samples/raw-mustache-as-root/main.svelte @@ -0,0 +1,17 @@ + + + + + + +

          This line should be last.

          \ No newline at end of file diff --git a/test/runtime/samples/raw-mustache-inside-head/_config.js b/test/runtime/samples/raw-mustache-inside-head/_config.js new file mode 100644 index 0000000000..7923fc7238 --- /dev/null +++ b/test/runtime/samples/raw-mustache-inside-head/_config.js @@ -0,0 +1,16 @@ +export default { + async test({ assert, target, window }) { + const btn = target.querySelector("button"); + const clickEvent = new window.MouseEvent("click"); + + assert.equal(window.document.head.innerHTML.includes(''), true); + + await btn.dispatchEvent(clickEvent); + + assert.equal(window.document.head.innerHTML.includes(''), true); + + await btn.dispatchEvent(clickEvent); + + assert.equal(window.document.head.innerHTML.includes(''), true); + } +}; diff --git a/test/runtime/samples/raw-mustache-inside-head/main.svelte b/test/runtime/samples/raw-mustache-inside-head/main.svelte new file mode 100644 index 0000000000..25b9fdeee9 --- /dev/null +++ b/test/runtime/samples/raw-mustache-inside-head/main.svelte @@ -0,0 +1,16 @@ + + + + + + {@html content} + + diff --git a/test/runtime/samples/raw-mustache-inside-slot/Component.svelte b/test/runtime/samples/raw-mustache-inside-slot/Component.svelte new file mode 100644 index 0000000000..fcabccae48 --- /dev/null +++ b/test/runtime/samples/raw-mustache-inside-slot/Component.svelte @@ -0,0 +1,2 @@ + +

          This line should be last.

          \ No newline at end of file diff --git a/test/runtime/samples/raw-mustache-inside-slot/_config.js b/test/runtime/samples/raw-mustache-inside-slot/_config.js new file mode 100644 index 0000000000..e42fa7f517 --- /dev/null +++ b/test/runtime/samples/raw-mustache-inside-slot/_config.js @@ -0,0 +1,33 @@ +export default { + html: ` + +

          Another first line

          +

          This line should be last.

          + `, + async test({ assert, target, window }) { + const btn = target.querySelector("button"); + const clickEvent = new window.MouseEvent("click"); + + await btn.dispatchEvent(clickEvent); + + assert.htmlEqual( + target.innerHTML, + ` + +

          First line

          +

          This line should be last.

          + ` + ); + + await btn.dispatchEvent(clickEvent); + + assert.htmlEqual( + target.innerHTML, + ` + +

          Another first line

          +

          This line should be last.

          + ` + ); + } +}; diff --git a/test/runtime/samples/raw-mustache-inside-slot/main.svelte b/test/runtime/samples/raw-mustache-inside-slot/main.svelte new file mode 100644 index 0000000000..a022a68e95 --- /dev/null +++ b/test/runtime/samples/raw-mustache-inside-slot/main.svelte @@ -0,0 +1,17 @@ + + + + + + {@html content} + \ No newline at end of file diff --git a/test/runtime/samples/raw-mustaches-td-tr/_config.js b/test/runtime/samples/raw-mustaches-td-tr/_config.js new file mode 100644 index 0000000000..1bcad157f3 --- /dev/null +++ b/test/runtime/samples/raw-mustaches-td-tr/_config.js @@ -0,0 +1,18 @@ +export default { + props: { + raw: "12" + }, + + html: ` + + + + + + + + + +
          57
          12
          + ` +}; diff --git a/test/runtime/samples/raw-mustaches-td-tr/main.svelte b/test/runtime/samples/raw-mustaches-td-tr/main.svelte new file mode 100644 index 0000000000..07d7299e43 --- /dev/null +++ b/test/runtime/samples/raw-mustaches-td-tr/main.svelte @@ -0,0 +1,12 @@ + + + + + + + + {@html raw} + +
          57
          \ No newline at end of file diff --git a/test/runtime/samples/reactive-assignment-in-complex-declaration-with-store-2/_config.js b/test/runtime/samples/reactive-assignment-in-complex-declaration-with-store-2/_config.js new file mode 100644 index 0000000000..f737cad2aa --- /dev/null +++ b/test/runtime/samples/reactive-assignment-in-complex-declaration-with-store-2/_config.js @@ -0,0 +1,9 @@ +// destructure to store value +export default { + skip_if_ssr: true, // pending https://github.com/sveltejs/svelte/issues/3582 + html: `

          2 2 xxx 5 6 9 10 2

          `, + async test({ assert, target, component }) { + await component.update(); + assert.htmlEqual(target.innerHTML, `

          11 11 yyy 12 13 14 15 11

          `); + } +}; \ No newline at end of file diff --git a/test/runtime/samples/reactive-assignment-in-complex-declaration-with-store-2/main.svelte b/test/runtime/samples/reactive-assignment-in-complex-declaration-with-store-2/main.svelte new file mode 100644 index 0000000000..c1bf63d9cd --- /dev/null +++ b/test/runtime/samples/reactive-assignment-in-complex-declaration-with-store-2/main.svelte @@ -0,0 +1,29 @@ + + +

          {foo} {$eid} {$u.name} {$v} {$w} {$x} {$y} {$z}

          diff --git a/test/runtime/samples/reactive-assignment-in-complex-declaration-with-store/_config.js b/test/runtime/samples/reactive-assignment-in-complex-declaration-with-store/_config.js new file mode 100644 index 0000000000..0318e63b0a --- /dev/null +++ b/test/runtime/samples/reactive-assignment-in-complex-declaration-with-store/_config.js @@ -0,0 +1,9 @@ +// destructure to store +export default { + html: `

          2 2 xxx 5 6 9 10 2

          `, + skip_if_ssr: true, + async test({ assert, target, component }) { + await component.update(); + assert.htmlEqual(target.innerHTML, `

          11 11 yyy 12 13 14 15 11

          `); + } +}; \ No newline at end of file diff --git a/test/runtime/samples/reactive-assignment-in-complex-declaration-with-store/main.svelte b/test/runtime/samples/reactive-assignment-in-complex-declaration-with-store/main.svelte new file mode 100644 index 0000000000..cd49223535 --- /dev/null +++ b/test/runtime/samples/reactive-assignment-in-complex-declaration-with-store/main.svelte @@ -0,0 +1,29 @@ + + +

          {foo} {$eid} {u.name} {v} {$w} {$x} {$y} {$z}

          diff --git a/test/runtime/samples/reactive-assignment-in-declaration/main.svelte b/test/runtime/samples/reactive-assignment-in-declaration/main.svelte index 8aa05964dd..edac4427bb 100644 --- a/test/runtime/samples/reactive-assignment-in-declaration/main.svelte +++ b/test/runtime/samples/reactive-assignment-in-declaration/main.svelte @@ -1,6 +1,9 @@

          {foo} {bar}

          diff --git a/test/runtime/samples/reactive-assignment-in-for-loop-head/main.svelte b/test/runtime/samples/reactive-assignment-in-for-loop-head/main.svelte index 1c24f364ac..b007f6fe8b 100644 --- a/test/runtime/samples/reactive-assignment-in-for-loop-head/main.svelte +++ b/test/runtime/samples/reactive-assignment-in-for-loop-head/main.svelte @@ -1,9 +1,14 @@

          {foo1} {foo2}

          diff --git a/test/runtime/samples/reactive-function-called-reassigned/_config.js b/test/runtime/samples/reactive-function-called-reassigned/_config.js new file mode 100644 index 0000000000..7b2a8b72fe --- /dev/null +++ b/test/runtime/samples/reactive-function-called-reassigned/_config.js @@ -0,0 +1,27 @@ +let value; +let called = 0; +function callback(_value) { + called ++; + value = _value; +} + +export default { + props: { + callback + }, + async test({ assert, component, target, window }) { + assert.equal(called, 1); + + const input = target.querySelector('input'); + + const event = new window.Event('input'); + input.value = 'h'; + await input.dispatchEvent(event); + + assert.equal(called, 2); + assert.equal(value.length, 3); + assert.equal(value[0], 'h'); + assert.equal(value[1], '2'); + assert.equal(value[2], '3'); + } +}; diff --git a/test/runtime/samples/reactive-function-called-reassigned/main.svelte b/test/runtime/samples/reactive-function-called-reassigned/main.svelte new file mode 100644 index 0000000000..10a3c79d14 --- /dev/null +++ b/test/runtime/samples/reactive-function-called-reassigned/main.svelte @@ -0,0 +1,10 @@ + + +{#each refs as ref} + +{/each} \ No newline at end of file diff --git a/test/runtime/samples/reactive-import-statement-2/_config.js b/test/runtime/samples/reactive-import-statement-2/_config.js new file mode 100644 index 0000000000..ccc97cd076 --- /dev/null +++ b/test/runtime/samples/reactive-import-statement-2/_config.js @@ -0,0 +1,3 @@ +export default { + html: `

          prop value

          ` +}; diff --git a/test/runtime/samples/reactive-import-statement-2/data.js b/test/runtime/samples/reactive-import-statement-2/data.js new file mode 100644 index 0000000000..56fb86982c --- /dev/null +++ b/test/runtime/samples/reactive-import-statement-2/data.js @@ -0,0 +1,3 @@ +export const obj = { + prop: 'prop value' +}; diff --git a/test/runtime/samples/reactive-import-statement-2/main.svelte b/test/runtime/samples/reactive-import-statement-2/main.svelte new file mode 100644 index 0000000000..2582974b71 --- /dev/null +++ b/test/runtime/samples/reactive-import-statement-2/main.svelte @@ -0,0 +1,8 @@ + + +

          {prop}

          diff --git a/test/runtime/samples/reactive-import-statement/_config.js b/test/runtime/samples/reactive-import-statement/_config.js new file mode 100644 index 0000000000..45a844afa0 --- /dev/null +++ b/test/runtime/samples/reactive-import-statement/_config.js @@ -0,0 +1,38 @@ +import * as path from 'path'; + +export default { + html: ` + import +

          1 + 2 + 3 + 4 = 10

          + local +

          1 + 2 + 3 + 4 = 10

          + + `, + before_test() { + delete require.cache[path.resolve(__dirname, 'data.js')]; + }, + async test({ assert, target, window }) { + const btn = target.querySelector('button'); + const clickEvent = new window.MouseEvent('click'); + + await btn.dispatchEvent(clickEvent); + + assert.htmlEqual(target.innerHTML, ` + import +

          1 + 2 + 3 + 4 + 5 = 15

          + local +

          1 + 2 + 3 + 4 + 5 = 15

          + + `); + + await btn.dispatchEvent(clickEvent); + + assert.htmlEqual(target.innerHTML, ` + import +

          1 + 2 + 3 + 4 + 5 + 6 = 21

          + local +

          1 + 2 + 3 + 4 + 5 + 6 = 21

          + + `); + } +}; diff --git a/test/runtime/samples/reactive-import-statement/data.js b/test/runtime/samples/reactive-import-statement/data.js new file mode 100644 index 0000000000..ad494c7cb0 --- /dev/null +++ b/test/runtime/samples/reactive-import-statement/data.js @@ -0,0 +1 @@ +export const numbers = [1, 2, 3, 4]; \ No newline at end of file diff --git a/test/runtime/samples/reactive-import-statement/main.svelte b/test/runtime/samples/reactive-import-statement/main.svelte new file mode 100644 index 0000000000..daded0494f --- /dev/null +++ b/test/runtime/samples/reactive-import-statement/main.svelte @@ -0,0 +1,19 @@ + + +import

          {numbers.join(' + ')} = {sum}

          +local

          {local_numbers.join(' + ')} = {local_sum}

          + + \ No newline at end of file diff --git a/test/runtime/samples/reactive-value-assign-property/_config.js b/test/runtime/samples/reactive-value-assign-property/_config.js new file mode 100644 index 0000000000..b6d8bf51be --- /dev/null +++ b/test/runtime/samples/reactive-value-assign-property/_config.js @@ -0,0 +1,5 @@ +export default { + html: ` +

          Hello world!

          + ` +}; diff --git a/test/runtime/samples/reactive-value-assign-property/main.svelte b/test/runtime/samples/reactive-value-assign-property/main.svelte new file mode 100644 index 0000000000..58e0fdb03c --- /dev/null +++ b/test/runtime/samples/reactive-value-assign-property/main.svelte @@ -0,0 +1,6 @@ + + +

          Hello {user.name}!

          \ No newline at end of file diff --git a/test/runtime/samples/self-reference-component/Countdown.svelte b/test/runtime/samples/self-reference-component/Countdown.svelte new file mode 100644 index 0000000000..21178f2567 --- /dev/null +++ b/test/runtime/samples/self-reference-component/Countdown.svelte @@ -0,0 +1,7 @@ + + +{#if count > 0} + +{/if} \ No newline at end of file diff --git a/test/runtime/samples/self-reference-component/_config.js b/test/runtime/samples/self-reference-component/_config.js new file mode 100644 index 0000000000..e9cd0ac440 --- /dev/null +++ b/test/runtime/samples/self-reference-component/_config.js @@ -0,0 +1,3 @@ +export default { + html: '5 4 3 2 1 0' +}; \ No newline at end of file diff --git a/test/runtime/samples/self-reference-component/main.svelte b/test/runtime/samples/self-reference-component/main.svelte new file mode 100644 index 0000000000..fd28ec4e40 --- /dev/null +++ b/test/runtime/samples/self-reference-component/main.svelte @@ -0,0 +1,10 @@ + + +{count} + + + + \ No newline at end of file diff --git a/test/runtime/samples/set-undefined-attr/_config.js b/test/runtime/samples/set-undefined-attr/_config.js index b23f51dfc9..a0df368e65 100644 --- a/test/runtime/samples/set-undefined-attr/_config.js +++ b/test/runtime/samples/set-undefined-attr/_config.js @@ -1,5 +1,5 @@ export default { html: `
          `, - ssrHtml: `
          `, + ssrHtml: `
          ` }; diff --git a/test/runtime/samples/sigil-component-prop/_config.js b/test/runtime/samples/sigil-component-prop/_config.js index 2f467bb9d4..9f84a59994 100644 --- a/test/runtime/samples/sigil-component-prop/_config.js +++ b/test/runtime/samples/sigil-component-prop/_config.js @@ -3,5 +3,5 @@ export default { dev: true }, props: { foo: 'foo' }, - html: `
          foo @ foo # foo
          `, + html: `
          foo @ foo # foo
          ` }; diff --git a/test/runtime/samples/slot-if-block-update-no-anchor/_config.js b/test/runtime/samples/slot-if-block-update-no-anchor/_config.js new file mode 100644 index 0000000000..58d2b49ade --- /dev/null +++ b/test/runtime/samples/slot-if-block-update-no-anchor/_config.js @@ -0,0 +1,7 @@ +export default { + test({ assert, target, component }) { + assert.htmlEqual(target.innerHTML, ``); + component.enabled = true; + assert.htmlEqual(target.innerHTML, `enabled`); + } +}; diff --git a/test/runtime/samples/slot-if-block-update-no-anchor/main.svelte b/test/runtime/samples/slot-if-block-update-no-anchor/main.svelte new file mode 100644 index 0000000000..7960f35bc9 --- /dev/null +++ b/test/runtime/samples/slot-if-block-update-no-anchor/main.svelte @@ -0,0 +1,9 @@ + + + + + {#if enabled}enabled{/if} + + diff --git a/test/runtime/samples/spread-component-2/Widget.svelte b/test/runtime/samples/spread-component-2/Widget.svelte new file mode 100644 index 0000000000..ae27aeb5e5 --- /dev/null +++ b/test/runtime/samples/spread-component-2/Widget.svelte @@ -0,0 +1,13 @@ + + +

          foo: {foo}

          +

          baz: {baz} ({typeof baz})

          +

          qux: {qux}

          +

          quux: {quux}

          +

          selected: {selected}

          diff --git a/test/runtime/samples/spread-component-2/_config.js b/test/runtime/samples/spread-component-2/_config.js new file mode 100644 index 0000000000..e5441bc4b9 --- /dev/null +++ b/test/runtime/samples/spread-component-2/_config.js @@ -0,0 +1,76 @@ +export default { + props: { + list: [{ + foo: 'lol', + baz: 40 + 2, + qux: 5, + quux: 'core' + }, { + foo: 'lolzz', + baz: 50 + 2, + qux: 1, + quux: 'quuxx' + }] + }, + + html: ` +
          +

          foo: lol

          +

          baz: 42 (number)

          +

          qux: 0

          +

          quux: core

          +

          selected: true

          +

          foo: lolzz

          +

          baz: 52 (number)

          +

          qux: 0

          +

          quux: quuxx

          +

          selected: false

          +
          + `, + + test({ assert, component, target }) { + component.list = [{ + foo: 'lol', + baz: 40 + 3, + qux: 8, + quux: 'heart' + }, { + foo: 'lolzz', + baz: 50 + 3, + qux: 8, + quux: 'heartxx' + }]; + + assert.htmlEqual(target.innerHTML, ` +
          +

          foo: lol

          +

          baz: 43 (number)

          +

          qux: 0

          +

          quux: heart

          +

          selected: true

          +

          foo: lolzz

          +

          baz: 53 (number)

          +

          qux: 0

          +

          quux: heartxx

          +

          selected: false

          +
          + `); + + component.qux = 1; + + assert.htmlEqual(target.innerHTML, ` +
          +

          foo: lol

          +

          baz: 43 (number)

          +

          qux: 1

          +

          quux: heart

          +

          selected: false

          +

          foo: lolzz

          +

          baz: 53 (number)

          +

          qux: 1

          +

          quux: heartxx

          +

          selected: true

          +
          + `); + } +}; diff --git a/test/runtime/samples/spread-component-2/main.svelte b/test/runtime/samples/spread-component-2/main.svelte new file mode 100644 index 0000000000..436e11f9c5 --- /dev/null +++ b/test/runtime/samples/spread-component-2/main.svelte @@ -0,0 +1,12 @@ + + +
          + {#each list as item, index (item.foo)} + + {/each} +
          diff --git a/test/runtime/samples/spread-component-dynamic-non-object-multiple-dependencies/_config.js b/test/runtime/samples/spread-component-dynamic-non-object-multiple-dependencies/_config.js index c5e23a023c..d7ad47b01f 100644 --- a/test/runtime/samples/spread-component-dynamic-non-object-multiple-dependencies/_config.js +++ b/test/runtime/samples/spread-component-dynamic-non-object-multiple-dependencies/_config.js @@ -2,7 +2,7 @@ export default { props: { props: { foo: 'lol', - baz: 40 + 2, + baz: 40 + 2 } }, diff --git a/test/runtime/samples/spread-component-dynamic-non-object/_config.js b/test/runtime/samples/spread-component-dynamic-non-object/_config.js index 094f2fbb9b..fa8de8ad94 100644 --- a/test/runtime/samples/spread-component-dynamic-non-object/_config.js +++ b/test/runtime/samples/spread-component-dynamic-non-object/_config.js @@ -2,7 +2,7 @@ export default { props: { props: { foo: 'lol', - baz: 40 + 2, + baz: 40 + 2 } }, diff --git a/test/runtime/samples/spread-component-dynamic-undefined/_config.js b/test/runtime/samples/spread-component-dynamic-undefined/_config.js index 09e5f87c14..e7e205a34b 100644 --- a/test/runtime/samples/spread-component-dynamic-undefined/_config.js +++ b/test/runtime/samples/spread-component-dynamic-undefined/_config.js @@ -1,17 +1,17 @@ export default { props: { props: { - a: 1, - }, + a: 1 + } }, html: ``, test({ assert, component, target }) { component.props = { - a: 2, + a: 2 }; assert.htmlEqual(target.innerHTML, ``); - }, + } }; diff --git a/test/runtime/samples/spread-component-dynamic/_config.js b/test/runtime/samples/spread-component-dynamic/_config.js index a6bf952ae0..08df27e1c2 100644 --- a/test/runtime/samples/spread-component-dynamic/_config.js +++ b/test/runtime/samples/spread-component-dynamic/_config.js @@ -1,8 +1,8 @@ export default { props: { props: { - a: 1, - }, + a: 1 + } }, html: ` @@ -11,9 +11,9 @@ export default { test({ assert, component, target }) { component.props = { - a: 2, + a: 2 }; assert.htmlEqual(target.innerHTML, `

          a: 2

          `); - }, + } }; diff --git a/test/runtime/samples/spread-component-multiple-dependencies/_config.js b/test/runtime/samples/spread-component-multiple-dependencies/_config.js index bc05f31130..070916ebd8 100644 --- a/test/runtime/samples/spread-component-multiple-dependencies/_config.js +++ b/test/runtime/samples/spread-component-multiple-dependencies/_config.js @@ -6,5 +6,5 @@ export default { target.innerHTML, `a baz` ); - }, + } }; diff --git a/test/runtime/samples/spread-each-component/_config.js b/test/runtime/samples/spread-each-component/_config.js index bc4d8ee7a4..66d2381875 100644 --- a/test/runtime/samples/spread-each-component/_config.js +++ b/test/runtime/samples/spread-each-component/_config.js @@ -20,5 +20,5 @@ export default {
          `); - }, + } }; diff --git a/test/runtime/samples/spread-each-element/_config.js b/test/runtime/samples/spread-each-element/_config.js index 5dbd82a892..579f840099 100644 --- a/test/runtime/samples/spread-each-element/_config.js +++ b/test/runtime/samples/spread-each-element/_config.js @@ -20,5 +20,5 @@ export default {
          `); - }, + } }; diff --git a/test/runtime/samples/spread-element-boolean/_config.js b/test/runtime/samples/spread-element-boolean/_config.js index 3ee277eec4..d336dae029 100644 --- a/test/runtime/samples/spread-element-boolean/_config.js +++ b/test/runtime/samples/spread-element-boolean/_config.js @@ -21,5 +21,5 @@ export default { `` ); assert.ok(!button.disabled); - }, + } }; diff --git a/test/runtime/samples/spread-element-input-bind-group-with-value-attr/_config.js b/test/runtime/samples/spread-element-input-bind-group-with-value-attr/_config.js new file mode 100644 index 0000000000..6e1b890351 --- /dev/null +++ b/test/runtime/samples/spread-element-input-bind-group-with-value-attr/_config.js @@ -0,0 +1,15 @@ +export default { + props: { + props: { + 'data-foo': 'bar' + } + }, + + html: ``, + + async test({ assert, component, target, window }) { + const input = target.querySelector('input'); + assert.equal(input.value, 'abc'); + assert.equal(input.__value, 'abc'); + } +}; diff --git a/test/runtime/samples/spread-element-input-bind-group-with-value-attr/main.svelte b/test/runtime/samples/spread-element-input-bind-group-with-value-attr/main.svelte new file mode 100644 index 0000000000..ce6b76f093 --- /dev/null +++ b/test/runtime/samples/spread-element-input-bind-group-with-value-attr/main.svelte @@ -0,0 +1,6 @@ + + + diff --git a/test/runtime/samples/spread-element-input-select-multiple/_config.js b/test/runtime/samples/spread-element-input-select-multiple/_config.js new file mode 100644 index 0000000000..1ddcd9eb6d --- /dev/null +++ b/test/runtime/samples/spread-element-input-select-multiple/_config.js @@ -0,0 +1,39 @@ +export default { + async test({ assert, component, target, window }) { + const [input1, input2] = target.querySelectorAll('input'); + const select = target.querySelector('select'); + const [option1, option2] = select.childNodes; + + let selections = Array.from(select.selectedOptions); + assert.equal(selections.length, 2); + assert.ok(selections.includes(option1)); + assert.ok(selections.includes(option2)); + + const event = new window.Event('change'); + + input1.checked = false; + await input1.dispatchEvent(event); + + selections = Array.from(select.selectedOptions); + assert.equal(selections.length, 1); + assert.ok(!selections.includes(option1)); + assert.ok(selections.includes(option2)); + + input2.checked = false; + await input2.dispatchEvent(event); + input1.checked = true; + await input1.dispatchEvent(event); + + selections = Array.from(select.selectedOptions); + assert.equal(selections.length, 1); + assert.ok(selections.includes(option1)); + assert.ok(!selections.includes(option2)); + + component.spread = { value: ['Hello', 'World'] }; + + selections = Array.from(select.selectedOptions); + assert.equal(selections.length, 2); + assert.ok(selections.includes(option1)); + assert.ok(selections.includes(option2)); + } +}; diff --git a/test/runtime/samples/spread-element-input-select-multiple/main.svelte b/test/runtime/samples/spread-element-input-select-multiple/main.svelte new file mode 100644 index 0000000000..d2fb12dd20 --- /dev/null +++ b/test/runtime/samples/spread-element-input-select-multiple/main.svelte @@ -0,0 +1,12 @@ + + + + + + \ No newline at end of file diff --git a/test/runtime/samples/spread-element-input-value-undefined/_config.js b/test/runtime/samples/spread-element-input-value-undefined/_config.js new file mode 100644 index 0000000000..d66e215cde --- /dev/null +++ b/test/runtime/samples/spread-element-input-value-undefined/_config.js @@ -0,0 +1,12 @@ +export default { + async test({ assert, component, target, window }) { + const input = target.querySelector("input"); + component.value = undefined; + + assert.equal(input.value, "undefined"); + + component.value = "foobar"; + + assert.equal(input.value, "foobar"); + } +}; diff --git a/test/runtime/samples/spread-element-input-value-undefined/main.svelte b/test/runtime/samples/spread-element-input-value-undefined/main.svelte new file mode 100644 index 0000000000..5c9121dc03 --- /dev/null +++ b/test/runtime/samples/spread-element-input-value-undefined/main.svelte @@ -0,0 +1,5 @@ + + + \ No newline at end of file diff --git a/test/runtime/samples/spread-element-input-value/InputOne.svelte b/test/runtime/samples/spread-element-input-value/InputOne.svelte new file mode 100644 index 0000000000..92ecb7b9a9 --- /dev/null +++ b/test/runtime/samples/spread-element-input-value/InputOne.svelte @@ -0,0 +1,18 @@ + + + diff --git a/test/runtime/samples/spread-element-input-value/InputTwo.svelte b/test/runtime/samples/spread-element-input-value/InputTwo.svelte new file mode 100644 index 0000000000..33ec0622a4 --- /dev/null +++ b/test/runtime/samples/spread-element-input-value/InputTwo.svelte @@ -0,0 +1,19 @@ + + + diff --git a/test/runtime/samples/spread-element-input-value/_config.js b/test/runtime/samples/spread-element-input-value/_config.js new file mode 100644 index 0000000000..abb63ceab3 --- /dev/null +++ b/test/runtime/samples/spread-element-input-value/_config.js @@ -0,0 +1,62 @@ +export default { + async test({ assert, component, target, window }) { + const [input1, input2] = target.querySelectorAll("input"); + + // we are not able emulate user interaction in jsdom, + // therefore, jsdom could not validate minlength / maxlength + + // we simulate user input with + // setting input.value + dispathEvent + + // and we determine if svelte does not set the `input.value` again by + // spying on the setter of `input.value` + + const spy1 = spyOnValueSetter(input1, input1.value); + const spy2 = spyOnValueSetter(input2, input2.value); + + const event = new window.Event("input"); + + input1.value = '12345'; + spy1.reset(); + await input1.dispatchEvent(event); + + assert.ok(!spy1.isSetCalled()); + + input2.value = '12345'; + spy2.reset(); + await input2.dispatchEvent(event); + + assert.ok(!spy2.isSetCalled()); + + spy1.reset(); + component.val1 = '56789'; + assert.ok(spy1.isSetCalled()); + + spy2.reset(); + component.val2 = '56789'; + assert.ok(spy2.isSetCalled()); + } +}; + +function spyOnValueSetter(input, initialValue) { + let value = initialValue; + let isSet = false; + Object.defineProperty(input, "value", { + get() { + return value; + }, + set(_value) { + value = _value; + isSet = true; + } + }); + + return { + isSetCalled() { + return isSet; + }, + reset() { + isSet = false; + } + }; +} diff --git a/test/runtime/samples/spread-element-input-value/main.svelte b/test/runtime/samples/spread-element-input-value/main.svelte new file mode 100644 index 0000000000..bb5f0e00bf --- /dev/null +++ b/test/runtime/samples/spread-element-input-value/main.svelte @@ -0,0 +1,9 @@ + + + + \ No newline at end of file diff --git a/test/runtime/samples/spread-element-input-value/utils.js b/test/runtime/samples/spread-element-input-value/utils.js new file mode 100644 index 0000000000..ee941bda55 --- /dev/null +++ b/test/runtime/samples/spread-element-input-value/utils.js @@ -0,0 +1,6 @@ +export function omit(obj, ...keysToOmit) { + return Object.keys(obj).reduce((acc, key) => { + if (keysToOmit.indexOf(key) === -1) acc[key] = obj[key]; + return acc; + }, {}); +} diff --git a/test/runtime/samples/spread-element-multiple-dependencies/_config.js b/test/runtime/samples/spread-element-multiple-dependencies/_config.js index 69ef1f8ebe..480eb6621c 100644 --- a/test/runtime/samples/spread-element-multiple-dependencies/_config.js +++ b/test/runtime/samples/spread-element-multiple-dependencies/_config.js @@ -6,5 +6,5 @@ export default { target.innerHTML, `
          ` ); - }, + } }; diff --git a/test/runtime/samples/spread-element-multiple/_config.js b/test/runtime/samples/spread-element-multiple/_config.js index 641f74d727..0c04b16d40 100644 --- a/test/runtime/samples/spread-element-multiple/_config.js +++ b/test/runtime/samples/spread-element-multiple/_config.js @@ -2,12 +2,12 @@ export default { props: { a: { 'data-one': 1, - 'data-two': 2, + 'data-two': 2 }, c: { - 'data-b': 'overridden', + 'data-b': 'overridden' }, - d: 'deeeeee', + d: 'deeeeee' }, html: ` @@ -27,5 +27,5 @@ export default { target.innerHTML, `
          test
          ` ); - }, + } }; diff --git a/test/runtime/samples/store-assignment-updates-property/_config.js b/test/runtime/samples/store-assignment-updates-property/_config.js new file mode 100644 index 0000000000..65df38f9e4 --- /dev/null +++ b/test/runtime/samples/store-assignment-updates-property/_config.js @@ -0,0 +1,32 @@ +export default { + html: ` +

          a: {"foo":3,"bar":2}

          +

          b: {"foo":3}

          + + + `, + skip_if_ssr: true, + + async test({ assert, component, target, window }) { + const [btn1, btn2] = target.querySelectorAll('button'); + const click = new window.MouseEvent('click'); + + await btn1.dispatchEvent(click); + + assert.htmlEqual(target.innerHTML, ` +

          a: {"foo":4,"bar":2}

          +

          b: {"foo":4,"baz":0}

          + + + `); + + await btn2.dispatchEvent(click); + + assert.htmlEqual(target.innerHTML, ` +

          a: {"foo":5,"bar":2}

          +

          b: {"foo":5,"qux":0}

          + + + `); + } +}; \ No newline at end of file diff --git a/test/runtime/samples/store-assignment-updates-property/main.svelte b/test/runtime/samples/store-assignment-updates-property/main.svelte new file mode 100644 index 0000000000..c3196a278c --- /dev/null +++ b/test/runtime/samples/store-assignment-updates-property/main.svelte @@ -0,0 +1,24 @@ + + +

          a: {JSON.stringify($a)}

          +

          b: {JSON.stringify($b)}

          + + + diff --git a/test/validator/samples/a11y-label-has-associated-control/warnings.json b/test/validator/samples/a11y-label-has-associated-control/warnings.json new file mode 100644 index 0000000000..b70a1a47de --- /dev/null +++ b/test/validator/samples/a11y-label-has-associated-control/warnings.json @@ -0,0 +1,32 @@ +[ + { + "code": "a11y-label-has-associated-control", + "end": { + "character": 16, + "column": 16, + "line": 1 + }, + "message": "A11y: A form label must be associated with a control.", + "pos": 0, + "start": { + "character": 0, + "column": 0, + "line": 1 + } + }, + { + "code": "a11y-label-has-associated-control", + "end": { + "character": 149, + "column": 30, + "line": 6 + }, + "message": "A11y: A form label must be associated with a control.", + "pos": 119, + "start": { + "character": 119, + "column": 0, + "line": 6 + } + } +] diff --git a/test/validator/samples/a11y-media-has-caption/input.svelte b/test/validator/samples/a11y-media-has-caption/input.svelte new file mode 100644 index 0000000000..105269cddb --- /dev/null +++ b/test/validator/samples/a11y-media-has-caption/input.svelte @@ -0,0 +1,4 @@ + + + + diff --git a/test/validator/samples/a11y-media-has-caption/warnings.json b/test/validator/samples/a11y-media-has-caption/warnings.json new file mode 100644 index 0000000000..a8c894b1d4 --- /dev/null +++ b/test/validator/samples/a11y-media-has-caption/warnings.json @@ -0,0 +1,32 @@ +[ + { + "code": "a11y-media-has-caption", + "end": { + "character": 55, + "column": 15, + "line": 2 + }, + "message": "A11y: Media elements must have a ", + "pos": 40, + "start": { + "character": 40, + "column": 0, + "line": 2 + } + }, + { + "code": "a11y-media-has-caption", + "end": { + "character": 80, + "column": 24, + "line": 3 + }, + "message": "A11y: Media elements must have a ", + "pos": 56, + "start": { + "character": 56, + "column": 0, + "line": 3 + } + } +] diff --git a/test/validator/samples/a11y-no-onchange/input.svelte b/test/validator/samples/a11y-no-onchange/input.svelte new file mode 100644 index 0000000000..af2041f406 --- /dev/null +++ b/test/validator/samples/a11y-no-onchange/input.svelte @@ -0,0 +1,16 @@ + + + + \ No newline at end of file diff --git a/test/validator/samples/a11y-no-onchange/warnings.json b/test/validator/samples/a11y-no-onchange/warnings.json new file mode 100644 index 0000000000..461f546c0b --- /dev/null +++ b/test/validator/samples/a11y-no-onchange/warnings.json @@ -0,0 +1,32 @@ +[ + { + "code": "a11y-no-onchange", + "end": { + "character": 88, + "column": 9, + "line": 4 + }, + "message": "A11y: on:blur must be used instead of on:change, unless absolutely necessary and it causes no negative consequences for keyboard only or screen reader users.", + "pos": 0, + "start": { + "character": 0, + "column": 0, + "line": 1 + } + }, + { + "code": "a11y-no-onchange", + "end": { + "character": 249, + "column": 44, + "line": 10 + }, + "message": "A11y: on:blur must be used instead of on:change, unless absolutely necessary and it causes no negative consequences for keyboard only or screen reader users.", + "pos": 209, + "start": { + "character": 209, + "column": 4, + "line": 10 + } + } +] diff --git a/test/validator/samples/action-object/input.svelte b/test/validator/samples/action-object/input.svelte new file mode 100644 index 0000000000..e0962fa594 --- /dev/null +++ b/test/validator/samples/action-object/input.svelte @@ -0,0 +1,11 @@ + + + + \ No newline at end of file diff --git a/test/validator/samples/action-object/warnings.json b/test/validator/samples/action-object/warnings.json new file mode 100644 index 0000000000..e1ccbb55a2 --- /dev/null +++ b/test/validator/samples/action-object/warnings.json @@ -0,0 +1,17 @@ +[ + { + "code": "missing-declaration", + "end": { + "character": 217, + "column": 39, + "line": 11 + }, + "message": "'foo' is not defined", + "pos": 186, + "start": { + "character": 186, + "column": 8, + "line": 11 + } + } +] diff --git a/test/validator/samples/attribute-invalid-name-2/errors.json b/test/validator/samples/attribute-invalid-name-2/errors.json new file mode 100644 index 0000000000..9e0c437339 --- /dev/null +++ b/test/validator/samples/attribute-invalid-name-2/errors.json @@ -0,0 +1,15 @@ +[{ + "code": "illegal-attribute", + "message": "'3aa' is not a valid attribute name", + "start": { + "line": 1, + "column": 3, + "character": 3 + }, + "end": { + "line": 1, + "column": 12, + "character": 12 + }, + "pos": 3 +}] diff --git a/test/validator/samples/attribute-invalid-name-2/input.svelte b/test/validator/samples/attribute-invalid-name-2/input.svelte new file mode 100644 index 0000000000..6958a1b5aa --- /dev/null +++ b/test/validator/samples/attribute-invalid-name-2/input.svelte @@ -0,0 +1 @@ +

          Test

          diff --git a/test/validator/samples/attribute-invalid-name-3/errors.json b/test/validator/samples/attribute-invalid-name-3/errors.json new file mode 100644 index 0000000000..f583226882 --- /dev/null +++ b/test/validator/samples/attribute-invalid-name-3/errors.json @@ -0,0 +1,15 @@ +[{ + "code": "illegal-attribute", + "message": "'a*a' is not a valid attribute name", + "start": { + "line": 1, + "column": 3, + "character": 3 + }, + "end": { + "line": 1, + "column": 6, + "character": 6 + }, + "pos": 3 +}] diff --git a/test/validator/samples/attribute-invalid-name-3/input.svelte b/test/validator/samples/attribute-invalid-name-3/input.svelte new file mode 100644 index 0000000000..87c2df979a --- /dev/null +++ b/test/validator/samples/attribute-invalid-name-3/input.svelte @@ -0,0 +1 @@ +

          Test

          diff --git a/test/validator/samples/attribute-invalid-name-4/errors.json b/test/validator/samples/attribute-invalid-name-4/errors.json new file mode 100644 index 0000000000..a8959cebf3 --- /dev/null +++ b/test/validator/samples/attribute-invalid-name-4/errors.json @@ -0,0 +1,15 @@ +[{ + "code": "illegal-attribute", + "message": "'-a' is not a valid attribute name", + "start": { + "line": 1, + "column": 3, + "character": 3 + }, + "end": { + "line": 1, + "column": 5, + "character": 5 + }, + "pos": 3 +}] diff --git a/test/validator/samples/attribute-invalid-name-4/input.svelte b/test/validator/samples/attribute-invalid-name-4/input.svelte new file mode 100644 index 0000000000..92f68449b9 --- /dev/null +++ b/test/validator/samples/attribute-invalid-name-4/input.svelte @@ -0,0 +1 @@ +

          Test

          diff --git a/test/validator/samples/attribute-invalid-name-5/errors.json b/test/validator/samples/attribute-invalid-name-5/errors.json new file mode 100644 index 0000000000..b1e3acc5ef --- /dev/null +++ b/test/validator/samples/attribute-invalid-name-5/errors.json @@ -0,0 +1,15 @@ +[{ + "code": "illegal-attribute", + "message": "'a;' is not a valid attribute name", + "start": { + "line": 1, + "column": 3, + "character": 3 + }, + "end": { + "line": 1, + "column": 11, + "character": 11 + }, + "pos": 3 +}] diff --git a/test/validator/samples/attribute-invalid-name-5/input.svelte b/test/validator/samples/attribute-invalid-name-5/input.svelte new file mode 100644 index 0000000000..3a7dd05137 --- /dev/null +++ b/test/validator/samples/attribute-invalid-name-5/input.svelte @@ -0,0 +1 @@ +

          Test

          diff --git a/test/validator/samples/attribute-invalid-name/errors.json b/test/validator/samples/attribute-invalid-name/errors.json new file mode 100644 index 0000000000..9bdde1ee46 --- /dev/null +++ b/test/validator/samples/attribute-invalid-name/errors.json @@ -0,0 +1,15 @@ +[{ + "code": "illegal-attribute", + "message": "'}' is not a valid attribute name", + "start": { + "line": 1, + "column": 3, + "character": 3 + }, + "end": { + "line": 1, + "column": 4, + "character": 4 + }, + "pos": 3 +}] diff --git a/test/validator/samples/attribute-invalid-name/input.svelte b/test/validator/samples/attribute-invalid-name/input.svelte new file mode 100644 index 0000000000..56d9cfe23f --- /dev/null +++ b/test/validator/samples/attribute-invalid-name/input.svelte @@ -0,0 +1 @@ +

          Test

          diff --git a/test/validator/samples/await-shorthand-no-then/input.svelte b/test/validator/samples/await-shorthand-no-then/input.svelte new file mode 100644 index 0000000000..6e8a99f131 --- /dev/null +++ b/test/validator/samples/await-shorthand-no-then/input.svelte @@ -0,0 +1,7 @@ + + +{#await promise catch error} +

          Error: {error}

          +{/await} diff --git a/test/validator/samples/await-shorthand-no-then/warnings.json b/test/validator/samples/await-shorthand-no-then/warnings.json new file mode 100644 index 0000000000..fe51488c70 --- /dev/null +++ b/test/validator/samples/await-shorthand-no-then/warnings.json @@ -0,0 +1 @@ +[] diff --git a/test/validator/samples/binding-const-field/errors.json b/test/validator/samples/binding-const-field/errors.json new file mode 100644 index 0000000000..fe51488c70 --- /dev/null +++ b/test/validator/samples/binding-const-field/errors.json @@ -0,0 +1 @@ +[] diff --git a/test/validator/samples/binding-const-field/input.svelte b/test/validator/samples/binding-const-field/input.svelte new file mode 100644 index 0000000000..055a16438d --- /dev/null +++ b/test/validator/samples/binding-const-field/input.svelte @@ -0,0 +1,7 @@ + + + diff --git a/test/validator/samples/binding-const/errors.json b/test/validator/samples/binding-const/errors.json new file mode 100644 index 0000000000..6d48af9c4e --- /dev/null +++ b/test/validator/samples/binding-const/errors.json @@ -0,0 +1,15 @@ +[{ + "code": "invalid-binding", + "message": "Cannot bind to a variable which is not writable", + "pos": 61, + "start": { + "line": 5, + "column": 19, + "character": 61 + }, + "end": { + "line": 5, + "column": 24, + "character": 66 + } +}] \ No newline at end of file diff --git a/test/validator/samples/binding-const/input.svelte b/test/validator/samples/binding-const/input.svelte new file mode 100644 index 0000000000..1857a1932c --- /dev/null +++ b/test/validator/samples/binding-const/input.svelte @@ -0,0 +1,5 @@ + + + diff --git a/test/validator/samples/component-dynamic/input.svelte b/test/validator/samples/component-dynamic/input.svelte new file mode 100644 index 0000000000..f591a84fe1 --- /dev/null +++ b/test/validator/samples/component-dynamic/input.svelte @@ -0,0 +1,18 @@ + + + + + + \ No newline at end of file diff --git a/test/validator/samples/component-dynamic/options.json b/test/validator/samples/component-dynamic/options.json new file mode 100644 index 0000000000..3a50892eba --- /dev/null +++ b/test/validator/samples/component-dynamic/options.json @@ -0,0 +1,3 @@ +{ + "generate": true +} \ No newline at end of file diff --git a/test/validator/samples/component-dynamic/warnings.json b/test/validator/samples/component-dynamic/warnings.json new file mode 100644 index 0000000000..457ef11a1e --- /dev/null +++ b/test/validator/samples/component-dynamic/warnings.json @@ -0,0 +1,47 @@ +[ + { + "code": "reactive-component", + "message": " will not be reactive if Let changes. Use if you want this reactivity.", + "pos": 190, + "end": { + "character": 197, + "column": 7, + "line": 15 + }, + "start": { + "character": 190, + "column": 0, + "line": 15 + } + }, + { + "message": " will not be reactive if ExportLet changes. Use if you want this reactivity.", + "code": "reactive-component", + "pos": 198, + "end": { + "character": 211, + "column": 13, + "line": 16 + }, + "start": { + "character": 198, + "column": 0, + "line": 16 + } + }, + { + "message": " will not be reactive if Reactive changes. Use if you want this reactivity.", + "code": "reactive-component", + "pos": 212, + "end": { + "character": 224, + "column": 12, + "line": 17 + }, + "start": { + "character": 212, + "column": 0, + "line": 17 + } + } +] diff --git a/test/validator/samples/component-slotted-custom-element-2/errors.json b/test/validator/samples/component-slotted-custom-element-2/errors.json new file mode 100644 index 0000000000..06be51d72d --- /dev/null +++ b/test/validator/samples/component-slotted-custom-element-2/errors.json @@ -0,0 +1,9 @@ +[ + { + "code": "invalid-slotted-content", + "message": "Element with a slot='...' attribute must be a child of a component or a descendant of a custom element", + "start": { "line": 10, "column": 9, "character": 138 }, + "end": { "line": 10, "column": 19, "character": 148 }, + "pos": 138 + } +] diff --git a/test/validator/samples/component-slotted-custom-element-2/input.svelte b/test/validator/samples/component-slotted-custom-element-2/input.svelte new file mode 100644 index 0000000000..221659ca4d --- /dev/null +++ b/test/validator/samples/component-slotted-custom-element-2/input.svelte @@ -0,0 +1,14 @@ + + + + + {#if thing} +
          +
          +
          + {/if} + + \ No newline at end of file diff --git a/test/validator/samples/component-slotted-custom-element/errors.json b/test/validator/samples/component-slotted-custom-element/errors.json new file mode 100644 index 0000000000..0637a088a0 --- /dev/null +++ b/test/validator/samples/component-slotted-custom-element/errors.json @@ -0,0 +1 @@ +[] \ No newline at end of file diff --git a/test/validator/samples/component-slotted-custom-element/input.svelte b/test/validator/samples/component-slotted-custom-element/input.svelte new file mode 100644 index 0000000000..e0e27834c1 --- /dev/null +++ b/test/validator/samples/component-slotted-custom-element/input.svelte @@ -0,0 +1,15 @@ + + + + +
          +
          +
          + {#if thing} +
          + {/if} + + \ No newline at end of file diff --git a/test/validator/samples/component-slotted-each-block/errors.json b/test/validator/samples/component-slotted-each-block/errors.json index 89f394bca4..2944acae17 100644 --- a/test/validator/samples/component-slotted-each-block/errors.json +++ b/test/validator/samples/component-slotted-each-block/errors.json @@ -1,6 +1,6 @@ [{ "code": "invalid-slotted-content", - "message": "Cannot place slotted elements inside an each-block", + "message": "Element with a slot='...' attribute must be a child of a component or a descendant of a custom element", "start": { "line": 7, "column": 7, diff --git a/test/validator/samples/component-slotted-if-block/errors.json b/test/validator/samples/component-slotted-if-block/errors.json index ab35a77fce..3ae07c1b3b 100644 --- a/test/validator/samples/component-slotted-if-block/errors.json +++ b/test/validator/samples/component-slotted-if-block/errors.json @@ -1,6 +1,6 @@ [{ "code": "invalid-slotted-content", - "message": "Cannot place slotted elements inside an if-block", + "message": "Element with a slot='...' attribute must be a child of a component or a descendant of a custom element", "start": { "line": 7, "column": 7, diff --git a/test/validator/samples/each-block-destructured-object-rest-comma-after/errors.json b/test/validator/samples/each-block-destructured-object-rest-comma-after/errors.json index 549b6960eb..df899b7702 100644 --- a/test/validator/samples/each-block-destructured-object-rest-comma-after/errors.json +++ b/test/validator/samples/each-block-destructured-object-rest-comma-after/errors.json @@ -1,5 +1,5 @@ [{ - "code": "comma-after-rest", + "code": "parse-error", "message": "Comma is not permitted after the rest element", "pos": 100, "start": { diff --git a/test/validator/samples/each-block-invalid-context-destructured-object/errors.json b/test/validator/samples/each-block-invalid-context-destructured-object/errors.json new file mode 100644 index 0000000000..c96e3d2c8c --- /dev/null +++ b/test/validator/samples/each-block-invalid-context-destructured-object/errors.json @@ -0,0 +1,15 @@ +[{ + "code": "parse-error", + "message": "Unexpected keyword 'case'", + "start": { + "line": 1, + "column": 18, + "character": 18 + }, + "end": { + "line": 1, + "column": 18, + "character": 18 + }, + "pos": 18 +}] diff --git a/test/validator/samples/each-block-invalid-context-destructured-object/input.svelte b/test/validator/samples/each-block-invalid-context-destructured-object/input.svelte new file mode 100644 index 0000000000..a891f131a0 --- /dev/null +++ b/test/validator/samples/each-block-invalid-context-destructured-object/input.svelte @@ -0,0 +1,3 @@ +{#each cases as { case }} + {case.title} +{/each} diff --git a/test/validator/samples/each-block-invalid-context-destructured/errors.json b/test/validator/samples/each-block-invalid-context-destructured/errors.json index afe99ee219..62d6f62e87 100644 --- a/test/validator/samples/each-block-invalid-context-destructured/errors.json +++ b/test/validator/samples/each-block-invalid-context-destructured/errors.json @@ -1,6 +1,6 @@ [{ - "code": "unexpected-reserved-word", - "message": "'case' is a reserved word in JavaScript and cannot be used here", + "code": "parse-error", + "message": "Unexpected token", "start": { "line": 1, "column": 17, diff --git a/test/validator/samples/event-modifiers-invalid-nonpassive/errors.json b/test/validator/samples/event-modifiers-invalid-nonpassive/errors.json new file mode 100644 index 0000000000..a7e5a2a76c --- /dev/null +++ b/test/validator/samples/event-modifiers-invalid-nonpassive/errors.json @@ -0,0 +1,15 @@ +[{ + "message": "The 'passive' and 'nonpassive' modifiers cannot be used together", + "code": "invalid-event-modifier", + "start": { + "line": 1, + "column": 5, + "character": 5 + }, + "end": { + "line": 1, + "column": 51, + "character": 51 + }, + "pos": 5 +}] diff --git a/test/validator/samples/event-modifiers-invalid-nonpassive/input.svelte b/test/validator/samples/event-modifiers-invalid-nonpassive/input.svelte new file mode 100644 index 0000000000..3557aa4b1d --- /dev/null +++ b/test/validator/samples/event-modifiers-invalid-nonpassive/input.svelte @@ -0,0 +1,3 @@ +
          + oops +
          \ No newline at end of file diff --git a/test/validator/samples/event-modifiers-invalid/errors.json b/test/validator/samples/event-modifiers-invalid/errors.json index 8be2ca7348..59a142d632 100644 --- a/test/validator/samples/event-modifiers-invalid/errors.json +++ b/test/validator/samples/event-modifiers-invalid/errors.json @@ -1,5 +1,5 @@ [{ - "message": "Valid event modifiers are preventDefault, stopPropagation, capture, once, passive or self", + "message": "Valid event modifiers are preventDefault, stopPropagation, capture, once, passive, nonpassive or self", "code": "invalid-event-modifier", "start": { "line": 1, diff --git a/test/validator/samples/import-meta/errors.json b/test/validator/samples/import-meta/errors.json new file mode 100644 index 0000000000..0637a088a0 --- /dev/null +++ b/test/validator/samples/import-meta/errors.json @@ -0,0 +1 @@ +[] \ No newline at end of file diff --git a/test/validator/samples/import-meta/input.svelte b/test/validator/samples/import-meta/input.svelte new file mode 100644 index 0000000000..a5ce32dd77 --- /dev/null +++ b/test/validator/samples/import-meta/input.svelte @@ -0,0 +1,6 @@ + + +{url} +{import.meta.url} diff --git a/test/validator/samples/slot-attribute-invalid/errors.json b/test/validator/samples/slot-attribute-invalid/errors.json index fc01fa9792..a75fdc065c 100644 --- a/test/validator/samples/slot-attribute-invalid/errors.json +++ b/test/validator/samples/slot-attribute-invalid/errors.json @@ -1,6 +1,6 @@ [{ "code": "invalid-slotted-content", - "message": "Element with a slot='...' attribute must be a descendant of a component or custom element", + "message": "Element with a slot='...' attribute must be a child of a component or a descendant of a custom element", "start": { "line": 1, "column": 5, diff --git a/test/vars/index.js b/test/vars/index.ts similarity index 95% rename from test/vars/index.js rename to test/vars/index.ts index a12ac177f2..4cebf7fbb4 100644 --- a/test/vars/index.js +++ b/test/vars/index.ts @@ -1,6 +1,6 @@ import * as fs from 'fs'; import * as assert from 'assert'; -import { svelte, loadConfig, tryToLoadJson } from '../helpers.js'; +import { svelte, loadConfig, tryToLoadJson } from '../helpers'; describe('vars', () => { fs.readdirSync(`${__dirname}/samples`).forEach(dir => { diff --git a/test/vars/samples/assumed-global/_config.js b/test/vars/samples/assumed-global/_config.js index 2b84e83f12..782760bb8b 100644 --- a/test/vars/samples/assumed-global/_config.js +++ b/test/vars/samples/assumed-global/_config.js @@ -1,5 +1,5 @@ export default { test(assert, vars) { assert.deepEqual(vars, []); - }, + } }; diff --git a/test/vars/samples/duplicate-globals/_config.js b/test/vars/samples/duplicate-globals/_config.js index 2b84e83f12..782760bb8b 100644 --- a/test/vars/samples/duplicate-globals/_config.js +++ b/test/vars/samples/duplicate-globals/_config.js @@ -1,5 +1,5 @@ export default { test(assert, vars) { assert.deepEqual(vars, []); - }, + } }; diff --git a/test/vars/samples/duplicate-non-hoistable/_config.js b/test/vars/samples/duplicate-non-hoistable/_config.js index 4ebc5b00cf..bd70e29800 100644 --- a/test/vars/samples/duplicate-non-hoistable/_config.js +++ b/test/vars/samples/duplicate-non-hoistable/_config.js @@ -13,5 +13,5 @@ export default { writable: true } ]); - }, + } }; diff --git a/test/vars/samples/duplicate-vars/_config.js b/test/vars/samples/duplicate-vars/_config.js index eb10c44a9a..749a0c59af 100644 --- a/test/vars/samples/duplicate-vars/_config.js +++ b/test/vars/samples/duplicate-vars/_config.js @@ -24,5 +24,5 @@ export default { writable: true } ]); - }, + } }; diff --git a/test/vars/samples/implicit-reactive/_config.js b/test/vars/samples/implicit-reactive/_config.js index 770de590e6..a8bf261d4f 100644 --- a/test/vars/samples/implicit-reactive/_config.js +++ b/test/vars/samples/implicit-reactive/_config.js @@ -24,5 +24,5 @@ export default { writable: true } ]); - }, + } }; diff --git a/test/vars/samples/modules-vars/_config.js b/test/vars/samples/modules-vars/_config.js new file mode 100644 index 0000000000..e178941db6 --- /dev/null +++ b/test/vars/samples/modules-vars/_config.js @@ -0,0 +1,72 @@ +export default { + test(assert, vars) { + assert.deepEqual(vars, [ + { + name: "a", + export_name: null, + injected: false, + module: true, + mutated: false, + reassigned: true, + referenced: false, + referenced_from_script: false, + writable: true + }, + { + name: "b", + export_name: null, + injected: false, + module: true, + mutated: true, + reassigned: false, + referenced: false, + referenced_from_script: false, + writable: true + }, + { + name: "c", + export_name: null, + injected: false, + module: true, + mutated: false, + reassigned: false, + referenced: false, + referenced_from_script: false, + writable: true + }, + { + name: "d", + export_name: null, + injected: false, + module: true, + mutated: false, + reassigned: false, + referenced: false, + referenced_from_script: false, + writable: true + }, + { + name: "c", + export_name: null, + injected: false, + module: false, + mutated: false, + reassigned: true, + referenced: false, + referenced_from_script: true, + writable: true + }, + { + name: "foo", + export_name: null, + injected: false, + module: false, + mutated: false, + reassigned: false, + referenced: false, + referenced_from_script: false, + writable: false + } + ]); + } +}; diff --git a/test/vars/samples/modules-vars/input.svelte b/test/vars/samples/modules-vars/input.svelte new file mode 100644 index 0000000000..8bbd5bdc5e --- /dev/null +++ b/test/vars/samples/modules-vars/input.svelte @@ -0,0 +1,18 @@ + + \ No newline at end of file diff --git a/test/vars/samples/referenced-from-script/_config.js b/test/vars/samples/referenced-from-script/_config.js index 191a52f8cc..ec068cb1d7 100644 --- a/test/vars/samples/referenced-from-script/_config.js +++ b/test/vars/samples/referenced-from-script/_config.js @@ -10,7 +10,7 @@ export default { reassigned: false, referenced: false, writable: false, - referenced_from_script: false, + referenced_from_script: false }, { name: 'j', @@ -21,7 +21,7 @@ export default { reassigned: false, referenced: false, writable: false, - referenced_from_script: false, + referenced_from_script: false }, { name: 'k', @@ -32,7 +32,7 @@ export default { reassigned: false, referenced: false, writable: false, - referenced_from_script: false, + referenced_from_script: false }, { name: 'a', @@ -43,7 +43,7 @@ export default { reassigned: true, referenced: false, writable: true, - referenced_from_script: true, + referenced_from_script: true }, { name: 'b', @@ -54,7 +54,7 @@ export default { reassigned: false, referenced: false, writable: true, - referenced_from_script: true, + referenced_from_script: true }, { name: 'c', @@ -65,7 +65,7 @@ export default { reassigned: false, referenced: false, writable: true, - referenced_from_script: true, + referenced_from_script: true }, { name: 'd', @@ -76,7 +76,7 @@ export default { reassigned: false, referenced: false, writable: true, - referenced_from_script: true, + referenced_from_script: true }, { name: 'e', @@ -87,7 +87,7 @@ export default { reassigned: false, referenced: false, writable: true, - referenced_from_script: false, + referenced_from_script: false }, { name: 'f', @@ -98,7 +98,7 @@ export default { reassigned: false, referenced: false, writable: true, - referenced_from_script: false, + referenced_from_script: false }, { name: 'g', @@ -109,7 +109,7 @@ export default { reassigned: false, referenced: false, writable: true, - referenced_from_script: true, + referenced_from_script: true }, { name: 'h', @@ -120,7 +120,7 @@ export default { reassigned: true, referenced: false, writable: true, - referenced_from_script: true, + referenced_from_script: true }, { name: 'foo', @@ -131,7 +131,7 @@ export default { reassigned: false, referenced: false, writable: false, - referenced_from_script: false, + referenced_from_script: false }, { name: 'l', @@ -142,7 +142,7 @@ export default { reassigned: false, referenced: false, referenced_from_script: true, - writable: false, + writable: false }, { name: 'bar', @@ -153,8 +153,8 @@ export default { reassigned: false, referenced: false, writable: false, - referenced_from_script: false, - }, + referenced_from_script: false + } ]); - }, + } }; diff --git a/test/vars/samples/template-references/_config.js b/test/vars/samples/template-references/_config.js index 674e351517..34c07e19e0 100644 --- a/test/vars/samples/template-references/_config.js +++ b/test/vars/samples/template-references/_config.js @@ -10,7 +10,7 @@ export default { reassigned: false, referenced: true, referenced_from_script: false, - writable: false, + writable: false }, { export_name: null, @@ -21,7 +21,7 @@ export default { reassigned: false, referenced: true, referenced_from_script: false, - writable: true, + writable: true }, { export_name: null, @@ -32,8 +32,8 @@ export default { reassigned: false, referenced: true, referenced_from_script: false, - writable: true, - }, + writable: true + } ]); - }, + } }; diff --git a/test/vars/samples/undeclared/_config.js b/test/vars/samples/undeclared/_config.js index 2b84e83f12..782760bb8b 100644 --- a/test/vars/samples/undeclared/_config.js +++ b/test/vars/samples/undeclared/_config.js @@ -1,5 +1,5 @@ export default { test(assert, vars) { assert.deepEqual(vars, []); - }, + } };