首页 发现 帮助
注册 登录
oleg
/
spruce
1
0
派生 0
文件 工单管理 0 合并请求 0 Wiki
浏览代码

Merge pull request #11 from ryangjchandler/tests

Write complete test suite
Ryan Chandler 5 年之前
父节点
81a268d8c9 d71d270cee
当前提交
14a3e37d3d
共有 14 个文件被更改，包括 233 次插入 和 630 次删除
分列视图 显示文件统计
  1. 31 0
      .github/workflows/tests.yml
  2. 0 18
      examples/cdn.html
  3. 9 9
      examples/index.html
  4. 0 10
      examples/store.js
  5. 0 2
      examples/test.js
  6. 6 0
      jest.config.js
  7. 0 1
      package.json
  8. 31 0
      tests/get.spec.js
  9. 41 0
      tests/observable.spec.js
  10. 35 0
      tests/set.spec.js
  11. 35 0
      tests/store.spec.js
  12. 26 0
      tests/subscribe.spec.js
  13. 11 0
      tests/utils.spec.js
  14. 8 590
      yarn.lock

+ 31 - 0
.github/workflows/tests.yml
查看文件 

@@ -0,0 +1,31 @@
 
+name: Run tests
 
+
 
+on:
 
+  pull_request:
 
+
 
+jobs:
 
+  tests:
 
+
 
+    runs-on: ubuntu-latest
 
+
 
+    strategy:
 
+      matrix:
 
+        node-version: [12.x]
 
+
 
+    steps:
 
+      - name: Checkout repository
 
+        uses: actions/checkout@v1
 
+
 
+      - name: Setup Node (${{ matrix.node-version }})
 
+        uses: actions/setup-node@v1
 
+        with:
 
+          node-version: ${{ matrix.node-version }}
 
+
 
+      - name: Install dependencies
 
+        run: yarn install --frozen-lockfile
 
+
 
+      - name: Build files
 
+        run: yarn build
 
+
 
+      - name: Run test suite
 
+        run: yarn test

+ 0 - 18
examples/cdn.html
查看文件 

@@ -1,18 +0,0 @@
 
-<html>
 
-    <head>
 
-        <script src="../dist/spruce.umd.js"></script>
 
-        <script src="https://cdn.jsdelivr.net/gh/alpinejs/alpine@v2.x.x/dist/alpine.min.js"></script>
 
-    </head>
 
-    <body>
 
-        <div x-data x-subscribe>
 
-            <input type="text" x-model="$store.dropdown.hello">
 
-            <span x-text="$store.dropdown.hello"></span>
 
-        </div>
 
-        
-        <h3>The button below is a completely different component</h3>
 
-
 
-        <div x-data x-subscribe>
 
-            <button @click="$store.dropdown.hello = 'amazing'">Update world to amazing</button>
 
-        </div>
 
-    </body>
 
-</html>

+ 9 - 9
examples/index.html
查看文件 

@@ -1,17 +1,17 @@
 
 <html>
 
     <head>
 
-        <script type="module" src="./test.js"></script>
 
+        <script src="../dist/spruce.umd.js"></script>
 
+        <script src="https://cdn.jsdelivr.net/gh/alpinejs/alpine@v2.x.x/dist/alpine.min.js"></script>
 
     </head>
 
     <body>
 
         <div x-data x-subscribe>
 
-            <input type="text" x-model="$store.dropdown.hello">
 
-            <span x-text="$store.dropdown.hello"></span>
 
-        </div>
 
-        
-        <h3>The button below is a completely different component</h3>
 
-
 
-        <div x-data x-subscribe>
 
-            <button @click="$store.dropdown.hello = null">Update world to amazing</button>
 
+            <span x-text="$store.application.name"></span>
 
+            <button @click="$store.application.name = 'Example'">Click</button>
 
         </div>
 
+        <script>
 
+            Spruce.store('application', {
 
+                name: 'Application'
 
+            })
 
+        </script>
 
     </body>
 
 </html>

+ 0 - 10
examples/store.js
查看文件 

@@ -1,10 +0,0 @@
 
-import Spruce from '../dist/spruce.module.js'
 
-
 
-Spruce.store('dropdown', {
 
-    hello: 'world',
 
-    testing: null,
 
-})
 
-
 
-Spruce.store('name', 'Application')
 
-
 
-export default Spruce

+ 0 - 2
examples/test.js
查看文件 

@@ -1,2 +0,0 @@
 
-import Store from './store.js'
 
-import '../node_modules/alpinejs/dist/alpine.js'

+ 6 - 0
jest.config.js
查看文件 

@@ -0,0 +1,6 @@
 
+module.exports = {
 
+    moduleDirectories: [
 
+        'node_modules',
 
+        'src'
 
+    ]
 
+}

+ 0 - 1
package.json
查看文件 

@@ -22,7 +22,6 @@
 
         "@testing-library/dom": "^7.2.2",
 
         "@testing-library/jest-dom": "^5.5.0",
 
         "alpinejs": "^2.3.1",
 
-        "ava": "^3.7.1",
 
         "jest": "^25.4.0",
 
         "jsdom-simulant": "^1.1.2",
 
         "microbundle": "^0.11.0",

+ 31 - 0
tests/get.spec.js
查看文件 

@@ -0,0 +1,31 @@
 
+import Alpine from 'alpinejs'
 
+import Spruce from '../dist/spruce'
 
+import { waitFor } from '@testing-library/dom'
 
+
 
+beforeEach(() => {
 
+    Spruce.subscribers = []
 
+})
 
+
 
+beforeAll(() => {
 
+    window.Spruce = Spruce
 
+})
 
+
 
+test('$store > data can be retrieved from store inside component', async () => {
 
+    document.body.innerHTML = `
 
+        <div x-data x-subscribe>
 
+            <span x-text="$store.foo.bar"></span>
 
+        </div> 
+    `
 
+
 
+    Spruce.store('foo', {
 
+        bar: 'bob'
 
+    })
 
+
 
+    await Spruce.start()
 
+    
+    Alpine.start()
 
+
 
+    await waitFor(() => {
 
+        expect(document.querySelector('span').innerText).toEqual('bob')
 
+    })
 
+})

+ 41 - 0
tests/observable.spec.js
查看文件 

@@ -0,0 +1,41 @@
 
+import { createObservable } from '../src/observable'
 
+
 
+test('createObservable > successfully wraps object', () => {
 
+    let target = {
 
+        foo: 'bar'
 
+    }
 
+
 
+    let observable = createObservable(target, () => {})
 
+
 
+    expect(observable.foo).toEqual('bar')
 
+})
 
+
 
+test('createObservable > can access deeply nested props', () => {
 
+    let target = {
 
+        foo: {
 
+            bar: {
 
+                baz: 'bob'
 
+            }
 
+        }
 
+    }
 
+
 
+    let observable = createObservable(target, () => {})
 
+
 
+    expect(observable.foo.bar.baz).toEqual('bob')
 
+})
 
+
 
+test('createObservable > will run callback on set trap', () => {
 
+    let target = {
 
+        foo: 'bar'
 
+    }
 
+
 
+    let fixture = 0
 
+
 
+    let observable = createObservable(target, () => {
 
+        fixture = 100
 
+    })
 
+
 
+    observable.foo = 'bob'
 
+
 
+    expect(fixture).toEqual(100)
 
+})

+ 35 - 0
tests/set.spec.js
查看文件 

@@ -0,0 +1,35 @@
 
+import Alpine from 'alpinejs'
 
+import Spruce from '../dist/spruce'
 
+import { waitFor } from '@testing-library/dom'
 
+
 
+beforeEach(() => {
 
+    Spruce.subscribers = []
 
+})
 
+
 
+beforeAll(() => {
 
+    window.Spruce = Spruce
 
+})
 
+
 
+test('$store > data can be set inside component', async () => {
 
+    document.body.innerHTML = `
 
+        <div x-data x-subscribe>
 
+            <span x-text="$store.foo.bar"></span>
 
+            <button @click="$store.foo.bar = 'car'"></button>
 
+        </div>
 
+    `
 
+
 
+    Spruce.store('foo', {
 
+        bar: 'bob'
 
+    })
 
+
 
+    await Spruce.start()
 
+    
+    Alpine.start()
 
+
 
+    document.querySelector('button').click()
 
+
 
+    await waitFor(() => {
 
+        expect(Spruce.stores.foo.bar).toEqual('car')
 
+        expect(document.querySelector('span').innerText).toEqual('car')
 
+    })
 
+})

+ 35 - 0
tests/store.spec.js
查看文件 

@@ -0,0 +1,35 @@
 
+import Spruce from '../dist/spruce'
 
+
 
+beforeEach(() => {
 
+    Spruce.stores = {}
 
+})
 
+
 
+test('Spruce.store() > namespace and data set correctly', () => {
 
+    Spruce.store('testing', {
 
+        foo: 'bar'
 
+    })
 
+
 
+    expect(Spruce.stores.testing).toEqual({
 
+        foo: 'bar'
 
+    })
 
+
 
+    expect(Spruce.stores.testing.foo).toEqual('bar')
 
+})
 
+
 
+test('Spruce.store() > existing namespace will not be overwritten', () => {
 
+    Spruce.store('testing', {
 
+        foo: 'bar'
 
+    })
 
+
 
+    expect(Spruce.stores.testing).toEqual({
 
+        foo: 'bar'
 
+    })
 
+
 
+    Spruce.store('testing', {
 
+        bob: 'car'
 
+    })
 
+
 
+    expect(Spruce.stores.testing).toEqual({
 
+        foo: 'bar'
 
+    })
 
+})

+ 26 - 0
tests/subscribe.spec.js
查看文件 

@@ -0,0 +1,26 @@
 
+import Spruce from '../dist/spruce'
 
+import { waitFor } from '@testing-library/dom'
 
+
 
+test('x-subscribe > correctly updates x-init directive', async () => {
 
+    document.body.innerHTML = `
 
+        <div x-subscribe></div>
 
+    `
 
+
 
+    Spruce.start()
 
+
 
+    await waitFor(() => {
 
+        expect(document.querySelector('div').getAttribute('x-init')).toEqual('$store = Spruce.subscribe($el)')
 
+    })
 
+})
 
+
 
+test('x-subscribe > correctly updates x-init when already defined', async () => {
 
+    document.body.innerHTML = `
 
+        <div x-subscribe x-init="testing = true"></div>
 
+    `
 
+
 
+    Spruce.start()
 
+
 
+    await waitFor(() => {
 
+        expect(document.querySelector('div').getAttribute('x-init')).toEqual('$store = Spruce.subscribe($el); testing = true')
 
+    })
 
+})

+ 11 - 0
tests/utils.spec.js
查看文件 

@@ -0,0 +1,11 @@
 
+import * as utils from '../src/utils'
 
+
 
+test('isNullOrUndefined > returns true for null and undefined', () => {
 
+    expect(utils.isNullOrUndefined(null)).toBeTruthy()
 
+    expect(utils.isNullOrUndefined(undefined)).toBeTruthy()
 
+})
 
+
 
+test('isNullOrUndefined > returns false for non null or undefined', () => {
 
+    expect(utils.isNullOrUndefined('')).toBeFalsy()
 
+    expect(utils.isNullOrUndefined(10)).toBeFalsy()
 
+})

文件差异内容过多而无法显示
+ 8 - 590
yarn.lock


部分文件因为文件数量过多而无法显示