Merge pull request #7 from lppjunior/develop

Add pipeline pattern

CHANGELOG.md

@@ -7,6 +7,10 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
+## [1.2.0] - 2020-08-25
+### Feature
+- Added pipeline pattern
+
 ## [1.1.0] - 2020-08-24
 ### Feature
 - Added middleware pattern

README.md

@@ -8,8 +8,39 @@ See many characteristics of this library:
 
 | Available Patterns       |
 |--------------------------|
-| [Observer](Observer)     |
-| [Middleware](Middleware) |
+| [Middleware](#Middleware) |
+| [Observer](#Observer)     |
+| [Pipeline](#Pipeline)     |
+
+## Middleware
+A single implementation of Middleware pattern
+
+**Class structure**
+```js
+class Middleware() {
+    use(callback: function)
+    process(...data: object)
+}
+```
+
+## Example
+
+```js
+  const middleware = new Middleware()
+
+  middleware.use((param1, param2, param3, next) => {
+    param1 = 'param 1 UPDATED'
+    console.log('Execution 1', param1, param2, param3)
+    next()
+  })
+
+  middleware.use((param1, param2, param3, next) => {
+    console.log('Execution 2', param1, param2, param3) // param1 = 'param 1 UPDATED'
+    next()
+  })
+
+  middleware.process('param 1', 'param 2', 'param 3')
+```
 
 ## Observer
 The instance (or model) maintains a collection of objects (observers) and will notify them of any changes in their state.
@@ -33,34 +64,26 @@ class Observer() {
   observer.emit('test', { status: 'Observer emit successful' })
 ```
 
-## Middleware
-A single implementation of Middleware pattern
+## Pipeline
+A Pipeline pattern implementation
 
 **Class structure**
 ```js
-class Middleware() {
-    use(callback: function)
-    process(...data: object)
+class Pipeline() {
+    pipe(callback: function)
+    process(data: object)
 }
 ```
 
 ## Example
 
 ```js
-  const middleware = new Middleware()
+  const result = (new Pipeline())
+    .pipe((data) => data + 5)
+    .pipe((data) => data * 20)
+    .pipe((data) => data / 2)
+    .process(5) // result 100
 
-  middleware.use((param1, param2, param3, next) => {
-    param1 = 'param 1 UPDATED'
-    console.log('Execution 1', param1, param2, param3)
-    next()
-  })
-
-  middleware.use((param1, param2, param3, next) => {
-    console.log('Execution 2', param1, param2, param3) // param1 = 'param 1 UPDATED'
-    next()
-  })
-
-  middleware.process('param 1', 'param 2', 'param 3')
 ```
 
 ## Versioning

src-example/index.html

@@ -11,6 +11,8 @@
     <h1>Patter JS</h1>
     <p>Open you inspection to see result</p>
 
-    <script src="main.js"></script>
+    <script src="middleware.js"></script>
+    <script src="observer.js"></script>
+    <script src="pipeline.js"></script>
   </body>
 </html>

src-example/src/middleware.js

@@ -0,0 +1,23 @@
+function testMiddleware () {
+  const middleware = new Middleware()
+  middleware.use((param1, param2, next) => {
+    param1.test += ' UPDATED'
+    console.log('[middleware] ', param1, param2)
+    next(param1, param2)
+  })
+
+  middleware.use((param1, param2, next) => {
+    param2 = param2 + ' UPDATED'
+    console.log('[middleware] ', param1, param2)
+    next(param1, param2)
+  })
+
+  middleware.use((param1, param2, next) => {
+    console.log('[middleware] ', param1, param2)
+    next(param1, param2)
+  })
+
+  middleware.process({ test: 123, value: 'aaa' }, 'test')
+}
+
+document.addEventListener('DOMContentLoaded', testMiddleware, false)

src-example/main.js → src-example/src/observer.js

@@ -3,9 +3,10 @@ function runExample () {
 }
 
 function testObserver () {
+  console.log('[observer] ', 'test')
   const observer = new Observer()
-  observer.on('test', (data) => console.log(data))
-  observer.on('test', (data) => console.log('Test 2 > ', data))
+  observer.on('test', (data) => console.log('[observer] ', data))
+  observer.on('test', (data) => console.log('[observer] ', 'Test 2 > ', data))
   observer.emit('test', { status: 'Observer emit successful' })
 }
 

src-example/src/pipeline.js

@@ -0,0 +1,20 @@
+function testPipeline () {
+  const result = (new Pipeline())
+    .pipe((data) => {
+      console.log('[pipeline] ', data + ' + ' + 5)
+      return data + 5
+    })
+    .pipe((data) => {
+      console.log('[pipeline] ', data + ' * ' + 3)
+      return data * 3
+    })
+    .pipe((data) => {
+      console.log('[pipeline] ', data + ' + ' + 150)
+      return data + 150
+    })
+    .process(5)
+
+  console.log('[pipeline] result: ', result)
+}
+
+document.addEventListener('DOMContentLoaded', testPipeline, false)

src/index.js

@@ -1,5 +1,9 @@
+import Middleware from './pattern/middleware'
 import Observer from './pattern/observer'
+import Pipeline from './pattern/pipeline'
 
 export {
-  Observer
+  Middleware,
+  Observer,
+  Pipeline
 }

src/pattern/pipeline/Pipeline.js

@@ -0,0 +1,17 @@
+class Pipeline {
+  constructor () {
+    this.pipelines = []
+  }
+
+  pipe (callback) {
+    this.pipelines.push(callback)
+    return this
+  }
+
+  process (data) {
+    let result = data
+    return this.pipelines.map(fn => (result = fn(result))).pop()
+  }
+}
+
+export default Pipeline

src/pattern/pipeline/__tests__/Pipeline.test.js

@@ -0,0 +1,40 @@
+import Pipeline from '../Pipeline'
+
+describe('Test Pipeline call all methods', () => {
+  const pipeline = new Pipeline()
+
+  test('should assert method pipeline.pipe was called', () => {
+    jest.spyOn(pipeline, 'pipe')
+    pipeline.pipe(() => {})
+    expect(pipeline.pipe).toHaveBeenCalled()
+  })
+
+  test('should assert method pipeline.process was called', () => {
+    jest.spyOn(pipeline, 'process')
+    pipeline.process(() => {})
+    expect(pipeline.process).toHaveBeenCalled()
+  })
+})
+
+describe('Test Pipeline call perfect scenaries', () => {
+  const result = (new Pipeline())
+    .pipe((data) => {
+      test('Data should be 5', () => {
+        expect(data).toBe(5)
+      })
+
+      return data + 5
+    })
+    .pipe((data) => {
+      test('Data should  be 10', () => {
+        expect(data).toBe(10)
+      })
+
+      return data * 2
+    })
+    .process(5)
+
+  test('Result should be 20', () => {
+    expect(result).toBe(20)
+  })
+})

src/pattern/pipeline/index.js

@@ -0,0 +1,3 @@
+import Pipeline from './Pipeline'
+
+export default Pipeline

webpack.config.js

@@ -8,7 +8,7 @@ module.exports = {
     patterns: './src'
   },
   output: {
-    filename: '[name].min.js',
+    filename: 'src/[name].min.js',
     path: path.resolve(__dirname, 'dist'),
     libraryTarget: 'umd'
   },
@@ -22,7 +22,7 @@ module.exports = {
     }),
     new CopyPlugin({
       patterns: [
-        { from: 'src-example/main.js', to: '' }
+        path.resolve(__dirname, 'src-example', 'src')
       ]
     })
   ],