example(integration): update static.controller in order to handle full static paths
MODIFY
README.md
README.md
<p align="center">
<a href="http://marblejs.com">
- <img src="https://github.com/marblejs/marble/blob/master/assets/logo.png?raw=true" width="320" alt="Marble.js logo"/>
+ <img src="https://github.com/marblejs/marble/blob/master/assets/img/logo.png?raw=true" width="320" alt="Marble.js logo"/>
</a>
</p>
@@ -29,7 +29,7 @@ Functional reactive HTTP middleware framework built on top of <a href="http://no
If we think closely how typical HTTP API works we can quickly recognize that it deals with streams of asynchronous events also called as HTTP requests. Describing it very briefly - typically each request needs to be transformed into response that goes back to the client (which is our event initiator) using custom middlewares or designated endpoints. In reactive programming world, all those core concepts we can translate into very simple marble diagram:
-![Marble.js core concept](https://github.com/marblejs/marble/blob/master/assets/flow.png?raw=true)
+![Marble.js core concept](https://github.com/marblejs/marble/blob/master/assets/img/flow.png?raw=true)
In this world everything is a stream. The core concept of **Marble.js** is based on the event flow of marble diagrams which are used to visually express time based behavior of HTTP streams. Ok, but why the heck we need those `observables`? Trends come and go, but asynchronously nature of JavaScript and Node.js platform constantly evolves. With reactive manner we can deliver complex features faster by providing the ability to compose complex tasks with ease and with less amount of code. If you have ever worked with libraries like <a href="https://redux-observable.js.org" target="blank">Redux Observable</a>, <a href="https://github.com/ngrx/platform/blob/master/docs/effects/README.md" target="blank">@ngrx/effects</a> or other libraries that leverages functional reactive paradigm, you will feel like at home. Still there? So lets get started!

RENAME
assets/flow.png
assets/img/flow.png
RENAME
assets/logo.png
assets/img/logo.png
MODIFY
assets/index.html
assets/index.html
</head>
<body>
<h1>Test</h1>
+ <img style="width: 200px" src="./img/logo.png" />
</body>
</html>

MODIFY
packages/@integration/src/controllers/static.controller.ts
packages/@integration/src/controllers/static.controller.ts
@@ -6,7 +6,7 @@ const { readFile } = internal;
const STATIC_PATH = path.resolve(__dirname, '../../../../assets');
const getFile$ = EffectFactory
- .matchPath('/:dir')
+ .matchPath('/:dir*')
.matchType('GET')
.use(req$ => req$
.pipe(

MODIFY
packages/@integration/test/integration.spec.ts
packages/@integration/test/integration.spec.ts
@@ -72,4 +72,8 @@ describe('API integration', () => {
.expect('Content-Type', ContentType.TEXT_HTML)
.then(res => expect(res.text).toContain('<h1>Test</h1>')));
+ test(`returns static file as ${ContentType.IMAGE_PNG}: /api/v1/static/img/flow.png`, async () =>
+ request(app)
+ .get('/api/v1/static/img/flow.png')
+ .expect('Content-Type', ContentType.IMAGE_PNG));
});

MODIFY
packages/core/src/response/specs/responseContentType.factory.spec.ts
packages/core/src/response/specs/responseContentType.factory.spec.ts
@@ -18,7 +18,7 @@ describe('Response content-type factory', () => {
it('#getMimeType detects mime-type from buffer', () => {
// given
- const body = fs.readFileSync(__dirname + '/../../../../../assets/logo.png');
+ const body = fs.readFileSync(__dirname + '/../../../../../assets/img/logo.png');
const path = '/test/index.html';
// when

example(integration): update static.controller in order to handle full static paths