Merge branch 'master' into fixing-reactivity-glitches

pull/6332/head
subtle-byte 5 years ago
commit 203254b399

@ -1,5 +1,9 @@
# Svelte changelog
## Unreleased
* Fix type signatures of `writable` and `readable`. It's possible to invoke them without arguments ([#6291](https://github.com/sveltejs/svelte/issues/6291), [#6345](https://github.com/sveltejs/svelte/issues/6345))
## 3.38.2
* Revert hydration optimisation for the time being ([#6279](https://github.com/sveltejs/svelte/issues/6279))

@ -245,10 +245,10 @@ This makes it possible to wrap almost any other reactive state handling library
#### `writable`
```js
store = writable(value: any)
store = writable(value?: any)
```
```js
store = writable(value: any, (set: (value: any) => void) => () => void)
store = writable(value?: any, start?: (set: (value: any) => void) => () => void)
```
---
@ -297,14 +297,12 @@ unsubscribe(); // logs 'no more subscribers'
#### `readable`
```js
store = readable(value: any, (set: (value: any) => void) => () => void)
store = readable(value?: any, start?: (set: (value: any) => void) => () => void)
```
---
Creates a store whose value cannot be set from 'outside', the first argument is the store's initial value.
The second argument to `readable` is the same as the second argument to `writable`, except that it is required with `readable` (since otherwise there would be no way to update the store value).
Creates a store whose value cannot be set from 'outside', the first argument is the store's initial value, and the second argument to `readable` is the same as the second argument to `writable`.
```js
import { readable } from 'svelte/store';

@ -2,7 +2,7 @@
title: Select bindings
---
We can also use `bind:value` with `<select>` elements. Update line 24:
We can also use `bind:value` with `<select>` elements. Update line 20:
```html
<select bind:value={selected} on:change="{() => answer = ''}">

@ -4,7 +4,7 @@ title: Media elements
The `<audio>` and `<video>` elements have several properties that you can bind to. This example demonstrates a few of them.
On line 116, add `currentTime={time}`, `duration` and `paused` bindings:
On line 58, add `currentTime={time}`, `duration` and `paused` bindings:
```html
<video

@ -4,7 +4,7 @@ title: <svelte:window>
Just as you can add event listeners to any DOM element, you can add event listeners to the `window` object with `<svelte:window>`.
On line 33, add the `keydown` listener:
On line 11, add the `keydown` listener:
```html
<svelte:window on:keydown={handleKeydown}/>

@ -2,7 +2,7 @@
title: <svelte:options>
---
Lastly, `<svelte:options>` allows you to specify compiler options.
The `<svelte:options>` element allows you to specify compiler options.
We'll use the `immutable` option as an example. In this app, the `<Todo>` component flashes whenever it receives new data. Clicking on one of the items toggles its `done` state by creating an updated `todos` array. This causes the *other* `<Todo>` items to flash, even though they don't end up making any changes to the DOM.

@ -51,7 +51,7 @@ const subscriber_queue = [];
* @param value initial value
* @param {StartStopNotifier}start start and stop notifications for subscriptions
*/
export function readable<T>(value: T, start: StartStopNotifier<T>): Readable<T> {
export function readable<T>(value?: T, start?: StartStopNotifier<T>): Readable<T> {
return {
subscribe: writable(value, start).subscribe
};
@ -62,7 +62,7 @@ export function readable<T>(value: T, start: StartStopNotifier<T>): Readable<T>
* @param {*=}value initial value
* @param {StartStopNotifier=}start start and stop notifications for subscriptions
*/
export function writable<T>(value: T, start: StartStopNotifier<T> = noop): Writable<T> {
export function writable<T>(value?: T, start: StartStopNotifier<T> = noop): Writable<T> {
let stop: Unsubscriber;
const subscriptions: Array<Subscription<T>> = [];

@ -22,6 +22,19 @@ describe('store', () => {
assert.deepEqual(values, [0, 1, 2]);
});
it('creates an undefined writable store', () => {
const store = writable();
const values = [];
const unsubscribe = store.subscribe(value => {
values.push(value);
});
unsubscribe();
assert.deepEqual(values, [undefined]);
});
it('calls provided subscribe handler', () => {
let called = 0;
@ -114,6 +127,32 @@ describe('store', () => {
assert.deepEqual(values, [0, 1, 2]);
});
it('creates an undefined readable store', () => {
const store = readable();
const values = [];
const unsubscribe = store.subscribe(value => {
values.push(value);
});
unsubscribe();
assert.deepEqual(values, [undefined]);
});
it('creates a readable store without updater', () => {
const store = readable(100);
const values = [];
const unsubscribe = store.subscribe(value => {
values.push(value);
});
unsubscribe();
assert.deepEqual(values, [100]);
});
});
const fake_observable = {
Loading…
Cancel
Save