|
1 | | -*Psst — looking for a shareable component template? Go here --> [sveltejs/component-template](https://github.com/sveltejs/component-template)* |
| 1 | +### svelte-testing-library |
2 | 2 |
|
3 | | ---- |
| 3 | +**_WIP_** |
4 | 4 |
|
5 | | -# svelte app |
| 5 | +## Installation |
6 | 6 |
|
7 | | -This is a project template for [Svelte](https://svelte.technology) apps. It lives at https://github.com/sveltejs/template. |
| 7 | +`npm i -D svelte-testing-library` |
8 | 8 |
|
9 | | -To create a new project based on this template using [degit](https://github.com/Rich-Harris/degit): |
| 9 | +## Usage |
10 | 10 |
|
11 | | -```bash |
12 | | -npx degit sveltejs/template svelte-app |
13 | | -cd svelte-app |
14 | | -``` |
15 | | - |
16 | | -*Note that you will need to have [Node.js](https://nodejs.org) installed.* |
17 | | - |
18 | | - |
19 | | -## Get started |
20 | | - |
21 | | -Install the dependencies... |
22 | | - |
23 | | -```bash |
24 | | -cd svelte-app |
25 | | -npm install |
26 | | -``` |
27 | | - |
28 | | -...then start [Rollup](https://rollupjs.org): |
29 | | - |
30 | | -```bash |
31 | | -npm run dev |
32 | | -``` |
| 11 | +App.svelte |
33 | 12 |
|
34 | | -Navigate to [localhost:5000](http://localhost:5000). You should see your app running. Edit a component file in `src`, save it, and reload the page to see your changes. |
| 13 | +```html |
| 14 | +<script> |
| 15 | + export let name; |
| 16 | +</script> |
35 | 17 |
|
| 18 | +<style> |
| 19 | + h1 { |
| 20 | + color: purple; |
| 21 | + } |
| 22 | +</style> |
36 | 23 |
|
37 | | -## Deploying to the web |
38 | | - |
39 | | -### With [now](https://zeit.co/now) |
40 | | - |
41 | | -Install `now` if you haven't already: |
42 | | - |
43 | | -```bash |
44 | | -npm install -g now |
45 | | -``` |
46 | | - |
47 | | -Then, from within your project folder: |
48 | | - |
49 | | -```bash |
50 | | -now |
| 24 | +<h1>Hello {name}!</h1> |
51 | 25 | ``` |
52 | 26 |
|
53 | | -As an alternative, use the [Now desktop client](https://zeit.co/download) and simply drag the unzipped project folder to the taskbar icon. |
54 | | - |
55 | | -### With [surge](https://surge.sh/) |
56 | | - |
57 | | -Install `surge` if you haven't already: |
58 | | - |
59 | | -```bash |
60 | | -npm install -g surge |
61 | | -``` |
| 27 | +App.spec.js |
62 | 28 |
|
63 | | -Then, from within your project folder: |
| 29 | +```javascript |
| 30 | +import App from "../src/App.svelte"; |
| 31 | +import { render } from "../src"; |
| 32 | +describe("App", () => { |
| 33 | + test("should render", () => { |
| 34 | + const { getByText } = render(App, { name: "world" }); |
64 | 35 |
|
65 | | -```bash |
66 | | -npm run build |
67 | | -surge public |
| 36 | + expect(getByText("Hello world!")); |
| 37 | + }); |
| 38 | +}); |
68 | 39 | ``` |
0 commit comments