@furystack/shades 3.7.2 → 4.0.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/component-factory.spec.js +68 -11
- package/dist/component-factory.spec.js.map +1 -1
- package/dist/components/lazy-load.spec.d.ts +2 -0
- package/dist/components/lazy-load.spec.d.ts.map +1 -0
- package/dist/components/lazy-load.spec.js +83 -0
- package/dist/components/lazy-load.spec.js.map +1 -0
- package/dist/components/route-link.d.ts.map +1 -1
- package/dist/components/route-link.js.map +1 -1
- package/dist/components/route-link.spec.d.ts +2 -0
- package/dist/components/route-link.spec.d.ts.map +1 -0
- package/dist/components/route-link.spec.js +38 -0
- package/dist/components/route-link.spec.js.map +1 -0
- package/dist/components/router.d.ts +4 -2
- package/dist/components/router.d.ts.map +1 -1
- package/dist/components/router.js +35 -26
- package/dist/components/router.js.map +1 -1
- package/dist/components/router.spec.d.ts +2 -0
- package/dist/components/router.spec.d.ts.map +1 -0
- package/dist/components/router.spec.js +93 -0
- package/dist/components/router.spec.js.map +1 -0
- package/dist/services/location-service.d.ts +1 -1
- package/dist/services/location-service.d.ts.map +1 -1
- package/dist/services/location-service.js +3 -2
- package/dist/services/location-service.js.map +1 -1
- package/dist/services/location-service.spec.js +29 -3
- package/dist/services/location-service.spec.js.map +1 -1
- package/dist/services/screen-service.d.ts +1 -1
- package/dist/services/screen-service.d.ts.map +1 -1
- package/dist/services/screen-service.js +5 -5
- package/dist/services/screen-service.js.map +1 -1
- package/dist/services/screen-service.spec.d.ts +2 -0
- package/dist/services/screen-service.spec.d.ts.map +1 -0
- package/dist/services/screen-service.spec.js +34 -0
- package/dist/services/screen-service.spec.js.map +1 -0
- package/dist/shade-resources.integration.spec.d.ts +2 -0
- package/dist/shade-resources.integration.spec.d.ts.map +1 -0
- package/dist/shade-resources.integration.spec.js +62 -0
- package/dist/shade-resources.integration.spec.js.map +1 -0
- package/dist/shade.d.ts +2 -0
- package/dist/shade.d.ts.map +1 -1
- package/dist/shade.js +22 -6
- package/dist/shade.js.map +1 -1
- package/dist/shades.integration.spec.d.ts +2 -0
- package/dist/shades.integration.spec.d.ts.map +1 -0
- package/dist/shades.integration.spec.js +123 -0
- package/dist/shades.integration.spec.js.map +1 -0
- package/package.json +8 -5
- package/src/component-factory.spec.tsx +97 -14
- package/src/components/lazy-load.spec.tsx +117 -0
- package/src/components/route-link.spec.tsx +50 -0
- package/src/components/route-link.tsx +2 -1
- package/src/components/router.spec.tsx +130 -0
- package/src/components/router.tsx +38 -29
- package/src/services/location-service.spec.ts +37 -3
- package/src/services/location-service.tsx +3 -2
- package/src/services/screen-service.spec.ts +39 -0
- package/src/services/screen-service.ts +1 -1
- package/src/shade-resources.integration.spec.tsx +94 -0
- package/src/shade.ts +29 -9
- package/src/shades.integration.spec.tsx +156 -0
|
@@ -2,19 +2,76 @@
|
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
const shade_component_1 = require("./shade-component");
|
|
4
4
|
require("./jsx");
|
|
5
|
+
const shade_1 = require("./shade");
|
|
6
|
+
const inject_1 = require("@furystack/inject");
|
|
5
7
|
describe('Shades Component Factory', () => {
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
8
|
+
describe('HTML Elements', () => {
|
|
9
|
+
it('Should create a simple component', () => {
|
|
10
|
+
const component = (0, shade_component_1.createComponent)("div", null, "test");
|
|
11
|
+
expect(component).toBeInstanceOf(HTMLDivElement);
|
|
12
|
+
expect(component.innerHTML).toBe('test');
|
|
13
|
+
expect(component.outerHTML).toBe('<div>test</div>');
|
|
14
|
+
});
|
|
15
|
+
it('Should apply styles', () => {
|
|
16
|
+
const component = (0, shade_component_1.createComponent)("div", { style: { color: 'red' } }, "a");
|
|
17
|
+
expect(component).toBeInstanceOf(HTMLDivElement);
|
|
18
|
+
expect(component.style.color).toBe('red');
|
|
19
|
+
});
|
|
20
|
+
it('Should apply data attributes', () => {
|
|
21
|
+
const component = (0, shade_component_1.createComponent)("div", { "data-testid": "asd-123" }, "a");
|
|
22
|
+
expect(component).toBeInstanceOf(HTMLDivElement);
|
|
23
|
+
expect(component.getAttribute('data-testid')).toBe('asd-123');
|
|
24
|
+
});
|
|
25
|
+
it('Should create a nested component', () => {
|
|
26
|
+
const component = ((0, shade_component_1.createComponent)("div", { style: { display: 'flex' } },
|
|
27
|
+
(0, shade_component_1.createComponent)("h1", null, "Hi, I'm a header"),
|
|
28
|
+
(0, shade_component_1.createComponent)("p", null,
|
|
29
|
+
"paragraph... ",
|
|
30
|
+
['a', 'b', 'c']),
|
|
31
|
+
(0, shade_component_1.createComponent)("a", { target: "_blank", href: "https://google.com" }, "link")));
|
|
32
|
+
expect(component).toBeInstanceOf(HTMLDivElement);
|
|
33
|
+
expect(component.childElementCount).toBe(3);
|
|
34
|
+
expect(component.innerHTML).toBe(`<h1>Hi, I'm a header</h1><p>paragraph... abc</p><a target="_blank" href="https://google.com">link</a>`);
|
|
35
|
+
});
|
|
36
|
+
it('Should attach listeners', () => {
|
|
37
|
+
const onclick = jest.fn();
|
|
38
|
+
const component = (0, shade_component_1.createComponent)("div", { onclick: onclick });
|
|
39
|
+
expect(component.onclick).toBe(onclick);
|
|
40
|
+
});
|
|
9
41
|
});
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
(0, shade_component_1.createComponent)("
|
|
13
|
-
(0, shade_component_1.createComponent)("
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
(
|
|
17
|
-
|
|
42
|
+
describe('Shade components', () => {
|
|
43
|
+
it('Should render a basic component', () => {
|
|
44
|
+
const Example = (0, shade_1.Shade)({ render: () => (0, shade_component_1.createComponent)("div", null) });
|
|
45
|
+
const component = ((0, shade_component_1.createComponent)("div", null,
|
|
46
|
+
(0, shade_component_1.createComponent)(Example, null)));
|
|
47
|
+
const shade = component.firstElementChild;
|
|
48
|
+
expect(shade.props.getValue()).toBe(null);
|
|
49
|
+
expect(shade.state.getValue()).toBe(undefined);
|
|
50
|
+
expect(shade.shadeChildren.getValue()).toStrictEqual([]);
|
|
51
|
+
});
|
|
52
|
+
it('Should render a component with props', () => {
|
|
53
|
+
const Example = (0, shade_1.Shade)({ render: ({ props }) => (0, shade_component_1.createComponent)("div", null, props.foo) });
|
|
54
|
+
const component = ((0, shade_component_1.createComponent)("div", null,
|
|
55
|
+
(0, shade_component_1.createComponent)(Example, { foo: "example", injector: new inject_1.Injector() })));
|
|
56
|
+
const shade = component.firstElementChild;
|
|
57
|
+
shade.callConstructed();
|
|
58
|
+
expect(shade.props.getValue().foo).toStrictEqual('example');
|
|
59
|
+
expect(shade.state.getValue()).toBe(undefined);
|
|
60
|
+
expect(shade.shadeChildren.getValue()).toStrictEqual([]);
|
|
61
|
+
expect(shade.innerHTML).toBe('<div>example</div>');
|
|
62
|
+
});
|
|
63
|
+
it('Should render a component with state', () => {
|
|
64
|
+
const Example = (0, shade_1.Shade)({
|
|
65
|
+
getInitialState: () => ({ foo: 'example' }),
|
|
66
|
+
render: () => (0, shade_component_1.createComponent)("div", null),
|
|
67
|
+
});
|
|
68
|
+
const component = ((0, shade_component_1.createComponent)("div", null,
|
|
69
|
+
(0, shade_component_1.createComponent)(Example, { injector: new inject_1.Injector() })));
|
|
70
|
+
const shade = component.firstElementChild;
|
|
71
|
+
shade.callConstructed();
|
|
72
|
+
expect(shade.state.getValue()).toStrictEqual({ foo: 'example' });
|
|
73
|
+
expect(shade.shadeChildren.getValue()).toStrictEqual([]);
|
|
74
|
+
});
|
|
18
75
|
});
|
|
19
76
|
});
|
|
20
77
|
//# sourceMappingURL=component-factory.spec.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"component-factory.spec.js","sourceRoot":"","sources":["../src/component-factory.spec.tsx"],"names":[],"mappings":";;AAAA,uDAAmD;AACnD,iBAAc;
|
|
1
|
+
{"version":3,"file":"component-factory.spec.js","sourceRoot":"","sources":["../src/component-factory.spec.tsx"],"names":[],"mappings":";;AAAA,uDAAmD;AACnD,iBAAc;AACd,mCAA+B;AAC/B,8CAA4C;AAE5C,QAAQ,CAAC,0BAA0B,EAAE,GAAG,EAAE;IACxC,QAAQ,CAAC,eAAe,EAAE,GAAG,EAAE;QAC7B,EAAE,CAAC,kCAAkC,EAAE,GAAG,EAAE;YAC1C,MAAM,SAAS,GAAG,2DAAe,CAAA;YACjC,MAAM,CAAC,SAAS,CAAC,CAAC,cAAc,CAAC,cAAc,CAAC,CAAA;YAChD,MAAM,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,CAAA;YACxC,MAAM,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAA;QACrD,CAAC,CAAC,CAAA;QAEF,EAAE,CAAC,qBAAqB,EAAE,GAAG,EAAE;YAC7B,MAAM,SAAS,GAAG,gDAAK,KAAK,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE,QAAS,CAAA;YACvD,MAAM,CAAC,SAAS,CAAC,CAAC,cAAc,CAAC,cAAc,CAAC,CAAA;YAChD,MAAM,CAAC,SAAS,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;QAC3C,CAAC,CAAC,CAAA;QAEF,EAAE,CAAC,8BAA8B,EAAE,GAAG,EAAE;YACtC,MAAM,SAAS,GAAG,+DAAiB,SAAS,QAAQ,CAAA;YACpD,MAAM,CAAC,SAAS,CAAC,CAAC,cAAc,CAAC,cAAc,CAAC,CAAA;YAChD,MAAM,CAAC,SAAS,CAAC,YAAY,CAAC,aAAa,CAAC,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,CAAA;QAC/D,CAAC,CAAC,CAAA;QAEF,EAAE,CAAC,kCAAkC,EAAE,GAAG,EAAE;YAC1C,MAAM,SAAS,GAAG,CAChB,gDAAK,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE;gBAC7B,sEAAyB;gBACzB;;oBAAiB,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC,CAAK;gBACrC,8CAAG,MAAM,EAAC,QAAQ,EAAC,IAAI,EAAC,oBAAoB,WAExC,CACA,CACP,CAAA;YACD,MAAM,CAAC,SAAS,CAAC,CAAC,cAAc,CAAC,cAAc,CAAC,CAAA;YAChD,MAAM,CAAC,SAAS,CAAC,iBAAiB,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAA;YAC3C,MAAM,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC,IAAI,CAC9B,uGAAuG,CACxG,CAAA;QACH,CAAC,CAAC,CAAA;QAEF,EAAE,CAAC,yBAAyB,EAAE,GAAG,EAAE;YACjC,MAAM,OAAO,GAAG,IAAI,CAAC,EAAE,EAAE,CAAA;YACzB,MAAM,SAAS,GAAG,gDAAK,OAAO,EAAE,OAAO,GAAQ,CAAA;YAC/C,MAAM,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAA;QACzC,CAAC,CAAC,CAAA;IACJ,CAAC,CAAC,CAAA;IAEF,QAAQ,CAAC,kBAAkB,EAAE,GAAG,EAAE;QAChC,EAAE,CAAC,iCAAiC,EAAE,GAAG,EAAE;YACzC,MAAM,OAAO,GAAG,IAAA,aAAK,EAAC,EAAE,MAAM,EAAE,GAAG,EAAE,CAAC,mDAAO,EAAE,CAAC,CAAA;YAEhD,MAAM,SAAS,GAAG,CAChB;gBACE,uCAAC,OAAO,OAAG,CACP,CACP,CAAA;YAED,MAAM,KAAK,GAAG,SAAS,CAAC,iBAAgC,CAAA;YACxD,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;YACzC,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,CAAA;YAC9C,MAAM,CAAC,KAAK,CAAC,aAAa,CAAC,QAAQ,EAAE,CAAC,CAAC,aAAa,CAAC,EAAE,CAAC,CAAA;QAC1D,CAAC,CAAC,CAAA;QAEF,EAAE,CAAC,sCAAsC,EAAE,GAAG,EAAE;YAC9C,MAAM,OAAO,GAAG,IAAA,aAAK,EAAsC,EAAE,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,oDAAM,KAAK,CAAC,GAAG,CAAO,EAAE,CAAC,CAAA;YAE7G,MAAM,SAAS,GAAG,CAChB;gBACE,uCAAC,OAAO,IAAC,GAAG,EAAC,SAAS,EAAC,QAAQ,EAAE,IAAI,iBAAQ,EAAE,GAAI,CAC/C,CACP,CAAA;YAED,MAAM,KAAK,GAAG,SAAS,CAAC,iBAAgC,CAAA;YAExD,KAAK,CAAC,eAAe,EAAE,CAAA;YAEvB,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC,GAAG,CAAC,CAAC,aAAa,CAAC,SAAS,CAAC,CAAA;YAC3D,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,CAAA;YAC9C,MAAM,CAAC,KAAK,CAAC,aAAa,CAAC,QAAQ,EAAE,CAAC,CAAC,aAAa,CAAC,EAAE,CAAC,CAAA;YAExD,MAAM,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAAA;QACpD,CAAC,CAAC,CAAA;QAEF,EAAE,CAAC,sCAAsC,EAAE,GAAG,EAAE;YAC9C,MAAM,OAAO,GAAG,IAAA,aAAK,EAA2B;gBAC9C,eAAe,EAAE,GAAG,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,SAAS,EAAE,CAAC;gBAC3C,MAAM,EAAE,GAAG,EAAE,CAAC,mDAAO;aACtB,CAAC,CAAA;YAEF,MAAM,SAAS,GAAG,CAChB;gBACE,uCAAC,OAAO,IAAC,QAAQ,EAAE,IAAI,iBAAQ,EAAE,GAAI,CACjC,CACP,CAAA;YAED,MAAM,KAAK,GAAG,SAAS,CAAC,iBAAgC,CAAA;YACxD,KAAK,CAAC,eAAe,EAAE,CAAA;YACvB,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC,CAAC,aAAa,CAAC,EAAE,GAAG,EAAE,SAAS,EAAE,CAAC,CAAA;YAChE,MAAM,CAAC,KAAK,CAAC,aAAa,CAAC,QAAQ,EAAE,CAAC,CAAC,aAAa,CAAC,EAAE,CAAC,CAAA;QAC1D,CAAC,CAAC,CAAA;IACJ,CAAC,CAAC,CAAA;AACJ,CAAC,CAAC,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"lazy-load.spec.d.ts","sourceRoot":"","sources":["../../src/components/lazy-load.spec.tsx"],"names":[],"mappings":""}
|
|
@@ -0,0 +1,83 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
const util_1 = require("util");
|
|
4
|
+
global.TextEncoder = util_1.TextEncoder;
|
|
5
|
+
global.TextDecoder = util_1.TextDecoder;
|
|
6
|
+
const inject_1 = require("@furystack/inject");
|
|
7
|
+
const utils_1 = require("@furystack/utils");
|
|
8
|
+
const lazy_load_1 = require("./lazy-load");
|
|
9
|
+
const jsdom_1 = require("jsdom");
|
|
10
|
+
const __1 = require("..");
|
|
11
|
+
describe('Lazy Load', () => {
|
|
12
|
+
const oldDoc = document;
|
|
13
|
+
beforeAll(() => {
|
|
14
|
+
globalThis.document = new jsdom_1.JSDOM().window.document;
|
|
15
|
+
window.matchMedia = () => ({ matches: true });
|
|
16
|
+
});
|
|
17
|
+
afterAll(() => {
|
|
18
|
+
globalThis.document = oldDoc;
|
|
19
|
+
});
|
|
20
|
+
beforeEach(() => (document.body.innerHTML = '<div id="root"></div>'));
|
|
21
|
+
afterEach(() => (document.body.innerHTML = ''));
|
|
22
|
+
it('Shuld display the loader and completed state', async () => {
|
|
23
|
+
const injector = new inject_1.Injector();
|
|
24
|
+
const rootElement = document.getElementById('root');
|
|
25
|
+
(0, __1.initializeShadeRoot)({
|
|
26
|
+
injector,
|
|
27
|
+
rootElement,
|
|
28
|
+
jsxElement: ((0, __1.createComponent)(lazy_load_1.LazyLoad, { loader: (0, __1.createComponent)("div", null, "Loading..."), component: async () => {
|
|
29
|
+
await (0, utils_1.sleepAsync)(100);
|
|
30
|
+
return (0, __1.createComponent)("div", null, "Loaded");
|
|
31
|
+
} })),
|
|
32
|
+
});
|
|
33
|
+
expect(document.body.innerHTML).toBe('<div id="root"><lazy-load><div>Loading...</div></lazy-load></div>');
|
|
34
|
+
await (0, utils_1.sleepAsync)(150);
|
|
35
|
+
expect(document.body.innerHTML).toBe('<div id="root"><lazy-load><div>Loaded</div></lazy-load></div>');
|
|
36
|
+
});
|
|
37
|
+
it('Shuld display the failed state with a retryer', async () => {
|
|
38
|
+
var _a;
|
|
39
|
+
const injector = new inject_1.Injector();
|
|
40
|
+
const rootElement = document.getElementById('root');
|
|
41
|
+
const load = jest.fn(async () => {
|
|
42
|
+
throw Error(':(');
|
|
43
|
+
});
|
|
44
|
+
(0, __1.initializeShadeRoot)({
|
|
45
|
+
injector,
|
|
46
|
+
rootElement,
|
|
47
|
+
jsxElement: ((0, __1.createComponent)(lazy_load_1.LazyLoad, { loader: (0, __1.createComponent)("div", null, "Loading..."), component: load, error: (e, retry) => ((0, __1.createComponent)("button", { id: "retry", onclick: retry }, e.message)) })),
|
|
48
|
+
});
|
|
49
|
+
expect(document.body.innerHTML).toBe('<div id="root"><lazy-load><div>Loading...</div></lazy-load></div>');
|
|
50
|
+
await (0, utils_1.sleepAsync)(1);
|
|
51
|
+
expect(load).toBeCalledTimes(1);
|
|
52
|
+
expect(document.body.innerHTML).toBe('<div id="root"><lazy-load><button id="retry">:(</button></lazy-load></div>');
|
|
53
|
+
(_a = document.getElementById('retry')) === null || _a === void 0 ? void 0 : _a.click();
|
|
54
|
+
expect(load).toBeCalledTimes(2);
|
|
55
|
+
});
|
|
56
|
+
it('Shuld display the failed state with a retryer', async () => {
|
|
57
|
+
var _a;
|
|
58
|
+
const injector = new inject_1.Injector();
|
|
59
|
+
const rootElement = document.getElementById('root');
|
|
60
|
+
let counter = 0;
|
|
61
|
+
const load = jest.fn(async () => {
|
|
62
|
+
if (!counter) {
|
|
63
|
+
counter += 1;
|
|
64
|
+
throw Error(':(');
|
|
65
|
+
}
|
|
66
|
+
return (0, __1.createComponent)("div", null, "success");
|
|
67
|
+
});
|
|
68
|
+
(0, __1.initializeShadeRoot)({
|
|
69
|
+
injector,
|
|
70
|
+
rootElement,
|
|
71
|
+
jsxElement: ((0, __1.createComponent)(lazy_load_1.LazyLoad, { loader: (0, __1.createComponent)("div", null, "Loading..."), component: load, error: (e, retry) => ((0, __1.createComponent)("button", { id: "retry", onclick: retry }, e.message)) })),
|
|
72
|
+
});
|
|
73
|
+
expect(document.body.innerHTML).toBe('<div id="root"><lazy-load><div>Loading...</div></lazy-load></div>');
|
|
74
|
+
await (0, utils_1.sleepAsync)(1);
|
|
75
|
+
expect(load).toBeCalledTimes(1);
|
|
76
|
+
expect(document.body.innerHTML).toBe('<div id="root"><lazy-load><button id="retry">:(</button></lazy-load></div>');
|
|
77
|
+
(_a = document.getElementById('retry')) === null || _a === void 0 ? void 0 : _a.click();
|
|
78
|
+
expect(load).toBeCalledTimes(2);
|
|
79
|
+
await (0, utils_1.sleepAsync)(1);
|
|
80
|
+
expect(document.body.innerHTML).toBe('<div id="root"><lazy-load><div>success</div></lazy-load></div>');
|
|
81
|
+
});
|
|
82
|
+
});
|
|
83
|
+
//# sourceMappingURL=lazy-load.spec.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"lazy-load.spec.js","sourceRoot":"","sources":["../../src/components/lazy-load.spec.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"route-link.d.ts","sourceRoot":"","sources":["../../src/components/route-link.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,cAAc,EAAE,MAAM,WAAW,CAAA;AAI1C,eAAO,MAAM,SAAS,
|
|
1
|
+
{"version":3,"file":"route-link.d.ts","sourceRoot":"","sources":["../../src/components/route-link.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,cAAc,EAAE,MAAM,WAAW,CAAA;AAI1C,eAAO,MAAM,SAAS,0GAgBpB,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"route-link.js","sourceRoot":"","sources":["../../src/components/route-link.tsx"],"names":[],"mappings":";;;AAAA,oCAAgC;AAEhC,0CAA6C;AAC7C,0BAAoC;AAEvB,QAAA,SAAS,GAAG,IAAA,aAAK,EAAoC;IAChE,aAAa,EAAE,YAAY;IAC3B,MAAM,EAAE,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,EAAE;QACxC,OAAO,CACL,mCACM,KAAK,EACT,OAAO,EAAE,CAAC,EAAc,EAAE,EAAE;gBAC1B,EAAE,CAAC,cAAc,EAAE,CAAA;gBACnB,OAAO,CAAC,SAAS,CAAC,EAAE,EAAE,KAAK,CAAC,KAAK,IAAI,EAAE,EAAE,KAAK,CAAC,IAAI,CAAC,CAAA;gBACpD,QAAQ,CAAC,WAAW,CAAC,0BAAe,CAAC,CAAC,WAAW,EAAE,CAAA;YACrD,CAAC,
|
|
1
|
+
{"version":3,"file":"route-link.js","sourceRoot":"","sources":["../../src/components/route-link.tsx"],"names":[],"mappings":";;;AAAA,oCAAgC;AAEhC,0CAA6C;AAC7C,0BAAoC;AAEvB,QAAA,SAAS,GAAG,IAAA,aAAK,EAAoC;IAChE,aAAa,EAAE,YAAY;IAC3B,MAAM,EAAE,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,EAAE;QACxC,OAAO,CACL,mCACM,KAAK,EACT,OAAO,EAAE,CAAC,EAAc,EAAE,EAAE;gBAC1B,EAAE,CAAC,cAAc,EAAE,CAAA;gBACnB,OAAO,CAAC,SAAS,CAAC,EAAE,EAAE,KAAK,CAAC,KAAK,IAAI,EAAE,EAAE,KAAK,CAAC,IAAI,CAAC,CAAA;gBACpD,QAAQ,CAAC,WAAW,CAAC,0BAAe,CAAC,CAAC,WAAW,EAAE,CAAA;YACrD,CAAC,IAEA,QAAQ,CACP,CACL,CAAA;IACH,CAAC;CACF,CAAC,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"route-link.spec.d.ts","sourceRoot":"","sources":["../../src/components/route-link.spec.tsx"],"names":[],"mappings":""}
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
const util_1 = require("util");
|
|
4
|
+
global.TextEncoder = util_1.TextEncoder;
|
|
5
|
+
global.TextDecoder = util_1.TextDecoder;
|
|
6
|
+
const inject_1 = require("@furystack/inject");
|
|
7
|
+
const route_link_1 = require("./route-link");
|
|
8
|
+
const jsdom_1 = require("jsdom");
|
|
9
|
+
const __1 = require("..");
|
|
10
|
+
describe('RouteLink', () => {
|
|
11
|
+
const oldDoc = document;
|
|
12
|
+
beforeAll(() => {
|
|
13
|
+
globalThis.document = new jsdom_1.JSDOM().window.document;
|
|
14
|
+
window.matchMedia = () => ({ matches: true });
|
|
15
|
+
});
|
|
16
|
+
afterAll(() => {
|
|
17
|
+
globalThis.document = oldDoc;
|
|
18
|
+
});
|
|
19
|
+
beforeEach(() => (document.body.innerHTML = '<div id="root"></div>'));
|
|
20
|
+
afterEach(() => (document.body.innerHTML = ''));
|
|
21
|
+
it('Shuld display the loader and completed state', async () => {
|
|
22
|
+
var _a;
|
|
23
|
+
const injector = new inject_1.Injector();
|
|
24
|
+
const rootElement = document.getElementById('root');
|
|
25
|
+
const onRouteChange = jest.fn();
|
|
26
|
+
injector.getInstance(__1.LocationService).onLocationChanged.subscribe(onRouteChange);
|
|
27
|
+
(0, __1.initializeShadeRoot)({
|
|
28
|
+
injector,
|
|
29
|
+
rootElement,
|
|
30
|
+
jsxElement: ((0, __1.createComponent)(route_link_1.RouteLink, { id: "route", href: "/subroute" }, "Link")),
|
|
31
|
+
});
|
|
32
|
+
expect(document.body.innerHTML).toBe('<div id="root"><route-link><a id="route" href="/subroute">Link</a></route-link></div>');
|
|
33
|
+
expect(onRouteChange).not.toBeCalled();
|
|
34
|
+
(_a = document.getElementById('route')) === null || _a === void 0 ? void 0 : _a.click();
|
|
35
|
+
expect(onRouteChange).toBeCalledTimes(1);
|
|
36
|
+
});
|
|
37
|
+
});
|
|
38
|
+
//# sourceMappingURL=route-link.spec.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"route-link.spec.js","sourceRoot":"","sources":["../../src/components/route-link.spec.tsx"],"names":[],"mappings":";;AAAA,+BAA+C;AAE/C,MAAM,CAAC,WAAW,GAAG,kBAAW,CAAA;AAChC,MAAM,CAAC,WAAW,GAAG,kBAAkB,CAAA;AAEvC,8CAA4C;AAC5C,6CAAwC;AACxC,iCAA6B;AAC7B,0BAA0E;AAE1E,QAAQ,CAAC,WAAW,EAAE,GAAG,EAAE;IACzB,MAAM,MAAM,GAAG,QAAQ,CAAA;IAEvB,SAAS,CAAC,GAAG,EAAE;QACb,UAAU,CAAC,QAAQ,GAAG,IAAI,aAAK,EAAE,CAAC,MAAM,CAAC,QAAQ,CAAA;QACjD,MAAM,CAAC,UAAU,GAAG,GAAG,EAAE,CAAC,CAAC,EAAE,OAAO,EAAE,IAAI,EAAU,CAAA,CAAA;IACtD,CAAC,CAAC,CAAA;IAEF,QAAQ,CAAC,GAAG,EAAE;QACZ,UAAU,CAAC,QAAQ,GAAG,MAAM,CAAA;IAC9B,CAAC,CAAC,CAAA;IAEF,UAAU,CAAC,GAAG,EAAE,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,SAAS,GAAG,uBAAuB,CAAC,CAAC,CAAA;IACrE,SAAS,CAAC,GAAG,EAAE,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,SAAS,GAAG,EAAE,CAAC,CAAC,CAAA;IAE/C,EAAE,CAAC,8CAA8C,EAAE,KAAK,IAAI,EAAE;;QAC5D,MAAM,QAAQ,GAAG,IAAI,iBAAQ,EAAE,CAAA;QAC/B,MAAM,WAAW,GAAG,QAAQ,CAAC,cAAc,CAAC,MAAM,CAAmB,CAAA;QAErE,MAAM,aAAa,GAAG,IAAI,CAAC,EAAE,EAAE,CAAA;QAE/B,QAAQ,CAAC,WAAW,CAAC,mBAAe,CAAC,CAAC,iBAAiB,CAAC,SAAS,CAAC,aAAa,CAAC,CAAA;QAEhF,IAAA,uBAAmB,EAAC;YAClB,QAAQ;YACR,WAAW;YACX,UAAU,EAAE,CACV,yBAAC,sBAAS,IAAC,EAAE,EAAC,OAAO,EAAC,IAAI,EAAC,WAAW,WAE1B,CACb;SACF,CAAC,CAAA;QACF,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,IAAI,CAClC,uFAAuF,CACxF,CAAA;QACD,MAAM,CAAC,aAAa,CAAC,CAAC,GAAG,CAAC,UAAU,EAAE,CAAA;QACtC,MAAA,QAAQ,CAAC,cAAc,CAAC,OAAO,CAAC,0CAAE,KAAK,EAAE,CAAA;QACzC,MAAM,CAAC,aAAa,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,CAAA;IAC1C,CAAC,CAAC,CAAA;AACJ,CAAC,CAAC,CAAA"}
|
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
import { MatchResult, TokensToRegexpOptions } from 'path-to-regexp';
|
|
2
2
|
import { RenderOptions } from '../models';
|
|
3
|
+
import Semaphore from 'semaphore-async-await';
|
|
3
4
|
export interface Route<TMatchResult extends object> {
|
|
4
5
|
url: string;
|
|
5
6
|
component: (options: {
|
|
6
|
-
currentUrl:
|
|
7
|
+
currentUrl: string;
|
|
7
8
|
match: MatchResult<TMatchResult>;
|
|
8
9
|
}) => JSX.Element;
|
|
9
10
|
routingOptions?: TokensToRegexpOptions;
|
|
@@ -13,12 +14,13 @@ export interface Route<TMatchResult extends object> {
|
|
|
13
14
|
export interface RouterProps {
|
|
14
15
|
style?: CSSStyleDeclaration;
|
|
15
16
|
routes: Array<Route<any>>;
|
|
16
|
-
notFound?: (currentUrl:
|
|
17
|
+
notFound?: (currentUrl: string) => JSX.Element;
|
|
17
18
|
}
|
|
18
19
|
export interface RouterState {
|
|
19
20
|
activeRoute?: Route<any>;
|
|
20
21
|
activeRouteParams?: any;
|
|
21
22
|
jsx?: JSX.Element;
|
|
23
|
+
lock: Semaphore;
|
|
22
24
|
}
|
|
23
25
|
export declare const Router: (props: RouterProps, children: import("../models").ChildrenList) => JSX.Element<any, any>;
|
|
24
26
|
//# sourceMappingURL=router.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"router.d.ts","sourceRoot":"","sources":["../../src/components/router.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAS,WAAW,EAAE,qBAAqB,EAAE,MAAM,gBAAgB,CAAA;AAC1E,OAAO,EAAE,aAAa,EAAE,MAAM,WAAW,CAAA;
|
|
1
|
+
{"version":3,"file":"router.d.ts","sourceRoot":"","sources":["../../src/components/router.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAS,WAAW,EAAE,qBAAqB,EAAE,MAAM,gBAAgB,CAAA;AAC1E,OAAO,EAAE,aAAa,EAAE,MAAM,WAAW,CAAA;AACzC,OAAO,SAAS,MAAM,uBAAuB,CAAA;AAE7C,MAAM,WAAW,KAAK,CAAC,YAAY,SAAS,MAAM;IAChD,GAAG,EAAE,MAAM,CAAA;IACX,SAAS,EAAE,CAAC,OAAO,EAAE;QAAE,UAAU,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,WAAW,CAAC,YAAY,CAAC,CAAA;KAAE,KAAK,GAAG,CAAC,OAAO,CAAA;IAC7F,cAAc,CAAC,EAAE,qBAAqB,CAAA;IACtC,OAAO,CAAC,EAAE,CAAC,OAAO,EAAE,aAAa,CAAC,WAAW,EAAE,WAAW,CAAC,KAAK,OAAO,CAAC,IAAI,CAAC,CAAA;IAC7E,OAAO,CAAC,EAAE,CAAC,OAAO,EAAE,aAAa,CAAC,WAAW,EAAE,WAAW,CAAC,KAAK,OAAO,CAAC,IAAI,CAAC,CAAA;CAC9E;AAED,MAAM,WAAW,WAAW;IAC1B,KAAK,CAAC,EAAE,mBAAmB,CAAA;IAC3B,MAAM,EAAE,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAA;IACzB,QAAQ,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,GAAG,CAAC,OAAO,CAAA;CAC/C;AAED,MAAM,WAAW,WAAW;IAC1B,WAAW,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,CAAA;IACxB,iBAAiB,CAAC,EAAE,GAAG,CAAA;IACvB,GAAG,CAAC,EAAE,GAAG,CAAC,OAAO,CAAA;IACjB,IAAI,EAAE,SAAS,CAAA;CAChB;AACD,eAAO,MAAM,MAAM,2FA+CjB,CAAA"}
|
|
@@ -1,44 +1,53 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.Router = void 0;
|
|
4
|
+
const tslib_1 = require("tslib");
|
|
4
5
|
const shade_1 = require("../shade");
|
|
5
6
|
const shade_component_1 = require("../shade-component");
|
|
6
7
|
const services_1 = require("../services");
|
|
7
8
|
const path_to_regexp_1 = require("path-to-regexp");
|
|
9
|
+
const semaphore_async_await_1 = (0, tslib_1.__importDefault)(require("semaphore-async-await"));
|
|
8
10
|
exports.Router = (0, shade_1.Shade)({
|
|
9
11
|
shadowDomName: 'shade-router',
|
|
10
|
-
getInitialState: () => ({
|
|
11
|
-
|
|
12
|
-
|
|
12
|
+
getInitialState: () => ({
|
|
13
|
+
lock: new semaphore_async_await_1.default(1),
|
|
14
|
+
}),
|
|
15
|
+
resources: ({ children, props, injector, updateState, getState, element }) => [
|
|
16
|
+
injector.getInstance(services_1.LocationService).onLocationChanged.subscribe(async (currentUrl) => {
|
|
13
17
|
var _a;
|
|
14
|
-
const { activeRoute: lastRoute, activeRouteParams: lastParams } = getState();
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
const
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
18
|
+
const { activeRoute: lastRoute, activeRouteParams: lastParams, lock } = getState();
|
|
19
|
+
try {
|
|
20
|
+
await lock.acquire();
|
|
21
|
+
for (const route of props.routes) {
|
|
22
|
+
const matchFn = (0, path_to_regexp_1.match)(route.url, route.routingOptions);
|
|
23
|
+
const matchResult = matchFn(currentUrl);
|
|
24
|
+
if (matchResult) {
|
|
25
|
+
if (route !== lastRoute || JSON.stringify(lastParams) !== JSON.stringify(matchResult.params)) {
|
|
26
|
+
if (lastRoute === null || lastRoute === void 0 ? void 0 : lastRoute.onLeave) {
|
|
27
|
+
await lastRoute.onLeave({ children, props, injector, updateState, getState, element });
|
|
28
|
+
}
|
|
29
|
+
updateState({
|
|
30
|
+
jsx: route.component({ currentUrl, match: matchResult }),
|
|
31
|
+
activeRoute: route,
|
|
32
|
+
activeRouteParams: matchResult.params,
|
|
33
|
+
});
|
|
34
|
+
if (route.onVisit) {
|
|
35
|
+
await route.onVisit({ children, props, injector, updateState, getState, element });
|
|
36
|
+
}
|
|
30
37
|
}
|
|
38
|
+
return;
|
|
31
39
|
}
|
|
32
|
-
return;
|
|
33
40
|
}
|
|
41
|
+
if (lastRoute === null || lastRoute === void 0 ? void 0 : lastRoute.onLeave) {
|
|
42
|
+
await lastRoute.onLeave({ children, props, injector, updateState, getState, element });
|
|
43
|
+
}
|
|
44
|
+
updateState({ jsx: (_a = props.notFound) === null || _a === void 0 ? void 0 : _a.call(props, currentUrl), activeRoute: undefined });
|
|
34
45
|
}
|
|
35
|
-
|
|
36
|
-
|
|
46
|
+
finally {
|
|
47
|
+
lock.release();
|
|
37
48
|
}
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
return () => subscription.dispose();
|
|
41
|
-
},
|
|
49
|
+
}, true),
|
|
50
|
+
],
|
|
42
51
|
render: ({ getState }) => {
|
|
43
52
|
const { jsx } = getState();
|
|
44
53
|
if (jsx) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"router.js","sourceRoot":"","sources":["../../src/components/router.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"router.js","sourceRoot":"","sources":["../../src/components/router.tsx"],"names":[],"mappings":";;;;AAAA,oCAAgC;AAChC,wDAAoD;AACpD,0CAA6C;AAC7C,mDAA0E;AAE1E,+FAA6C;AAsBhC,QAAA,MAAM,GAAG,IAAA,aAAK,EAA2B;IACpD,aAAa,EAAE,cAAc;IAC7B,eAAe,EAAE,GAAG,EAAE,CAAC,CAAC;QACtB,IAAI,EAAE,IAAI,+BAAS,CAAC,CAAC,CAAC;KACvB,CAAC;IACF,SAAS,EAAE,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAE,WAAW,EAAE,QAAQ,EAAE,OAAO,EAAE,EAAE,EAAE,CAAC;QAC5E,QAAQ,CAAC,WAAW,CAAC,0BAAe,CAAC,CAAC,iBAAiB,CAAC,SAAS,CAAC,KAAK,EAAE,UAAU,EAAE,EAAE;;YACrF,MAAM,EAAE,WAAW,EAAE,SAAS,EAAE,iBAAiB,EAAE,UAAU,EAAE,IAAI,EAAE,GAAG,QAAQ,EAAE,CAAA;YAClF,IAAI;gBACF,MAAM,IAAI,CAAC,OAAO,EAAE,CAAA;gBAEpB,KAAK,MAAM,KAAK,IAAI,KAAK,CAAC,MAAM,EAAE;oBAChC,MAAM,OAAO,GAAG,IAAA,sBAAK,EAAC,KAAK,CAAC,GAAG,EAAE,KAAK,CAAC,cAAc,CAAC,CAAA;oBACtD,MAAM,WAAW,GAAG,OAAO,CAAC,UAAU,CAAC,CAAA;oBACvC,IAAI,WAAW,EAAE;wBACf,IAAI,KAAK,KAAK,SAAS,IAAI,IAAI,CAAC,SAAS,CAAC,UAAU,CAAC,KAAK,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,MAAM,CAAC,EAAE;4BAC5F,IAAI,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,OAAO,EAAE;gCACtB,MAAM,SAAS,CAAC,OAAO,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAE,WAAW,EAAE,QAAQ,EAAE,OAAO,EAAE,CAAC,CAAA;6BACvF;4BACD,WAAW,CAAC;gCACV,GAAG,EAAE,KAAK,CAAC,SAAS,CAAC,EAAE,UAAU,EAAE,KAAK,EAAE,WAAW,EAAE,CAAC;gCACxD,WAAW,EAAE,KAAK;gCAClB,iBAAiB,EAAE,WAAW,CAAC,MAAM;6BACtC,CAAC,CAAA;4BACF,IAAI,KAAK,CAAC,OAAO,EAAE;gCACjB,MAAM,KAAK,CAAC,OAAO,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAE,WAAW,EAAE,QAAQ,EAAE,OAAO,EAAE,CAAC,CAAA;6BACnF;yBACF;wBACD,OAAM;qBACP;iBACF;gBACD,IAAI,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,OAAO,EAAE;oBACtB,MAAM,SAAS,CAAC,OAAO,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAE,WAAW,EAAE,QAAQ,EAAE,OAAO,EAAE,CAAC,CAAA;iBACvF;gBACD,WAAW,CAAC,EAAE,GAAG,EAAE,MAAA,KAAK,CAAC,QAAQ,+CAAd,KAAK,EAAY,UAAU,CAAC,EAAE,WAAW,EAAE,SAAS,EAAE,CAAC,CAAA;aAC3E;oBAAS;gBACR,IAAI,CAAC,OAAO,EAAE,CAAA;aACf;QACH,CAAC,EAAE,IAAI,CAAC;KACT;IACD,MAAM,EAAE,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE;QACvB,MAAM,EAAE,GAAG,EAAE,GAAG,QAAQ,EAAE,CAAA;QAC1B,IAAI,GAAG,EAAE;YACP,OAAO,GAAG,CAAA;SACX;QACD,OAAO,mDAAW,CAAA;IACpB,CAAC;CACF,CAAC,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"router.spec.d.ts","sourceRoot":"","sources":["../../src/components/router.spec.tsx"],"names":[],"mappings":""}
|
|
@@ -0,0 +1,93 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
const util_1 = require("util");
|
|
4
|
+
global.TextEncoder = util_1.TextEncoder;
|
|
5
|
+
global.TextDecoder = util_1.TextDecoder;
|
|
6
|
+
const inject_1 = require("@furystack/inject");
|
|
7
|
+
const router_1 = require("./router");
|
|
8
|
+
const jsdom_1 = require("jsdom");
|
|
9
|
+
const __1 = require("..");
|
|
10
|
+
const _1 = require(".");
|
|
11
|
+
const utils_1 = require("@furystack/utils");
|
|
12
|
+
describe('Router', () => {
|
|
13
|
+
const oldDoc = document;
|
|
14
|
+
beforeAll(() => {
|
|
15
|
+
globalThis.document = new jsdom_1.JSDOM().window.document;
|
|
16
|
+
window.matchMedia = () => ({ matches: true });
|
|
17
|
+
});
|
|
18
|
+
afterAll(() => {
|
|
19
|
+
globalThis.document = oldDoc;
|
|
20
|
+
});
|
|
21
|
+
beforeEach(() => (document.body.innerHTML = '<div id="root"></div>'));
|
|
22
|
+
afterEach(() => (document.body.innerHTML = ''));
|
|
23
|
+
it('Shuld display the loader and completed state', async () => {
|
|
24
|
+
history.pushState(null, '', '/');
|
|
25
|
+
const onVisit = jest.fn();
|
|
26
|
+
const onLeave = jest.fn();
|
|
27
|
+
const onLastLeave = jest.fn();
|
|
28
|
+
const injector = new inject_1.Injector();
|
|
29
|
+
const rootElement = document.getElementById('root');
|
|
30
|
+
const onRouteChange = jest.fn();
|
|
31
|
+
injector.getInstance(__1.LocationService).onLocationChanged.subscribe(onRouteChange);
|
|
32
|
+
(0, __1.initializeShadeRoot)({
|
|
33
|
+
injector,
|
|
34
|
+
rootElement,
|
|
35
|
+
jsxElement: ((0, __1.createComponent)("div", null,
|
|
36
|
+
(0, __1.createComponent)(_1.RouteLink, { id: "home", href: "/" }, "home"),
|
|
37
|
+
(0, __1.createComponent)(_1.RouteLink, { id: "a", href: "/route-a" }, "a"),
|
|
38
|
+
(0, __1.createComponent)(_1.RouteLink, { id: "b", href: "/route-b" }, "b"),
|
|
39
|
+
(0, __1.createComponent)(_1.RouteLink, { id: "b-with-id", href: "/route-b/123" }, "b-with-id"),
|
|
40
|
+
(0, __1.createComponent)(_1.RouteLink, { id: "c", href: "/route-c" }, "c"),
|
|
41
|
+
(0, __1.createComponent)(_1.RouteLink, { id: "x", href: "/route-x" }, "x"),
|
|
42
|
+
(0, __1.createComponent)(router_1.Router, { routes: [
|
|
43
|
+
{ url: '/route-a', component: () => (0, __1.createComponent)("div", { id: "content" }, "route-a"), onVisit, onLeave },
|
|
44
|
+
{ url: '/route-b/:id?', component: ({ match }) => (0, __1.createComponent)("div", { id: "content" },
|
|
45
|
+
"route-b",
|
|
46
|
+
match.params.id) },
|
|
47
|
+
{
|
|
48
|
+
url: '/route-c',
|
|
49
|
+
component: () => (0, __1.createComponent)("div", { id: "content" }, "route-c"),
|
|
50
|
+
onLeave: onLastLeave,
|
|
51
|
+
},
|
|
52
|
+
{ url: '/', component: () => (0, __1.createComponent)("div", { id: "content" }, "home") },
|
|
53
|
+
], notFound: () => (0, __1.createComponent)("div", { id: "content" }, "not found") }))),
|
|
54
|
+
});
|
|
55
|
+
const getContent = () => { var _a; return (_a = document.getElementById('content')) === null || _a === void 0 ? void 0 : _a.innerHTML; };
|
|
56
|
+
const getLocation = () => location.pathname;
|
|
57
|
+
const clickOn = (name) => { var _a; return (_a = document.getElementById(name)) === null || _a === void 0 ? void 0 : _a.click(); };
|
|
58
|
+
await (0, utils_1.sleepAsync)(100);
|
|
59
|
+
expect(getLocation()).toBe('/');
|
|
60
|
+
expect(getContent()).toBe('home');
|
|
61
|
+
expect(onVisit).not.toBeCalled();
|
|
62
|
+
clickOn('a');
|
|
63
|
+
await (0, utils_1.sleepAsync)(100);
|
|
64
|
+
expect(getContent()).toBe('route-a');
|
|
65
|
+
expect(getLocation()).toBe('/route-a');
|
|
66
|
+
expect(onRouteChange).toBeCalledTimes(1);
|
|
67
|
+
expect(onVisit).toBeCalledTimes(1);
|
|
68
|
+
clickOn('a');
|
|
69
|
+
await (0, utils_1.sleepAsync)(100);
|
|
70
|
+
expect(onVisit).toBeCalledTimes(1);
|
|
71
|
+
expect(onLeave).not.toBeCalled();
|
|
72
|
+
clickOn('b');
|
|
73
|
+
await (0, utils_1.sleepAsync)(100);
|
|
74
|
+
expect(onLeave).toBeCalledTimes(1);
|
|
75
|
+
expect(getContent()).toBe('route-b');
|
|
76
|
+
expect(getLocation()).toBe('/route-b');
|
|
77
|
+
clickOn('b-with-id');
|
|
78
|
+
await (0, utils_1.sleepAsync)(100);
|
|
79
|
+
expect(getContent()).toBe('route-b123');
|
|
80
|
+
expect(getLocation()).toBe('/route-b/123');
|
|
81
|
+
clickOn('c');
|
|
82
|
+
await (0, utils_1.sleepAsync)(100);
|
|
83
|
+
expect(getContent()).toBe('route-c');
|
|
84
|
+
expect(getLocation()).toBe('/route-c');
|
|
85
|
+
expect(onLastLeave).not.toBeCalled();
|
|
86
|
+
clickOn('x');
|
|
87
|
+
await (0, utils_1.sleepAsync)(100);
|
|
88
|
+
expect(getContent()).toBe('not found');
|
|
89
|
+
expect(getLocation()).toBe('/route-x');
|
|
90
|
+
expect(onLastLeave).toBeCalledTimes(1);
|
|
91
|
+
});
|
|
92
|
+
});
|
|
93
|
+
//# sourceMappingURL=router.spec.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"router.spec.js","sourceRoot":"","sources":["../../src/components/router.spec.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { Disposable, ObservableValue } from '@furystack/utils';
|
|
2
2
|
export declare class LocationService implements Disposable {
|
|
3
3
|
dispose(): void;
|
|
4
|
-
onLocationChanged: ObservableValue<
|
|
4
|
+
onLocationChanged: ObservableValue<string>;
|
|
5
5
|
updateState(): void;
|
|
6
6
|
private pushStateTracer;
|
|
7
7
|
private replaceStateTracer;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"location-service.d.ts","sourceRoot":"","sources":["../../src/services/location-service.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,eAAe,EAAS,MAAM,kBAAkB,CAAA;AAErE,qBACa,eAAgB,YAAW,UAAU;IACzC,OAAO;
|
|
1
|
+
{"version":3,"file":"location-service.d.ts","sourceRoot":"","sources":["../../src/services/location-service.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,eAAe,EAAS,MAAM,kBAAkB,CAAA;AAErE,qBACa,eAAgB,YAAW,UAAU;IACzC,OAAO;IAQP,iBAAiB,0BAAuD;IAExE,WAAW;IAKlB,OAAO,CAAC,eAAe,CAAY;IACnC,OAAO,CAAC,kBAAkB,CAAY;;CAoBvC"}
|
|
@@ -6,7 +6,7 @@ const utils_1 = require("@furystack/utils");
|
|
|
6
6
|
const inject_1 = require("@furystack/inject");
|
|
7
7
|
let LocationService = class LocationService {
|
|
8
8
|
constructor() {
|
|
9
|
-
this.onLocationChanged = new utils_1.ObservableValue(new URL(location.href));
|
|
9
|
+
this.onLocationChanged = new utils_1.ObservableValue(new URL(location.href).pathname);
|
|
10
10
|
window.addEventListener('popstate', () => this.updateState());
|
|
11
11
|
window.addEventListener('hashchange', () => this.updateState());
|
|
12
12
|
this.pushStateTracer = utils_1.Trace.method({
|
|
@@ -27,10 +27,11 @@ let LocationService = class LocationService {
|
|
|
27
27
|
window.removeEventListener('hashchange', this.updateState);
|
|
28
28
|
this.pushStateTracer.dispose();
|
|
29
29
|
this.replaceStateTracer.dispose();
|
|
30
|
+
this.onLocationChanged.dispose();
|
|
30
31
|
}
|
|
31
32
|
updateState() {
|
|
32
33
|
const newUrl = new URL(location.href);
|
|
33
|
-
this.onLocationChanged.setValue(newUrl);
|
|
34
|
+
this.onLocationChanged.setValue(newUrl.pathname);
|
|
34
35
|
}
|
|
35
36
|
};
|
|
36
37
|
LocationService = (0, tslib_1.__decorate)([
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"location-service.js","sourceRoot":"","sources":["../../src/services/location-service.tsx"],"names":[],"mappings":";;;;AAAA,4CAAqE;AACrE,8CAA8C;AAE9C,IAAa,eAAe,GAA5B,MAAa,eAAe;
|
|
1
|
+
{"version":3,"file":"location-service.js","sourceRoot":"","sources":["../../src/services/location-service.tsx"],"names":[],"mappings":";;;;AAAA,4CAAqE;AACrE,8CAA8C;AAE9C,IAAa,eAAe,GAA5B,MAAa,eAAe;IAmB1B;QAVO,sBAAiB,GAAG,IAAI,uBAAe,CAAC,IAAI,GAAG,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,QAAQ,CAAC,CAAA;QAW7E,MAAM,CAAC,gBAAgB,CAAC,UAAU,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC,CAAA;QAC7D,MAAM,CAAC,gBAAgB,CAAC,YAAY,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC,CAAA;QAE/D,IAAI,CAAC,eAAe,GAAG,aAAK,CAAC,MAAM,CAAC;YAClC,MAAM,EAAE,OAAO;YACf,MAAM,EAAE,OAAO,CAAC,SAAS;YACzB,OAAO,EAAE,KAAK;YACd,UAAU,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,WAAW,EAAE;SACrC,CAAC,CAAA;QAEF,IAAI,CAAC,kBAAkB,GAAG,aAAK,CAAC,MAAM,CAAC;YACrC,MAAM,EAAE,OAAO;YACf,MAAM,EAAE,OAAO,CAAC,YAAY;YAC5B,OAAO,EAAE,KAAK;YACd,UAAU,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,WAAW,EAAE;SACrC,CAAC,CAAA;IACJ,CAAC;IAnCM,OAAO;QACZ,MAAM,CAAC,mBAAmB,CAAC,UAAU,EAAE,IAAI,CAAC,WAAW,CAAC,CAAA;QACxD,MAAM,CAAC,mBAAmB,CAAC,YAAY,EAAE,IAAI,CAAC,WAAW,CAAC,CAAA;QAC1D,IAAI,CAAC,eAAe,CAAC,OAAO,EAAE,CAAA;QAC9B,IAAI,CAAC,kBAAkB,CAAC,OAAO,EAAE,CAAA;QACjC,IAAI,CAAC,iBAAiB,CAAC,OAAO,EAAE,CAAA;IAClC,CAAC;IAIM,WAAW;QAChB,MAAM,MAAM,GAAG,IAAI,GAAG,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAA;QACrC,IAAI,CAAC,iBAAiB,CAAC,QAAQ,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAA;IAClD,CAAC;CAuBF,CAAA;AArCY,eAAe;IAD3B,IAAA,mBAAU,EAAC,EAAE,QAAQ,EAAE,WAAW,EAAE,CAAC;;GACzB,eAAe,CAqC3B;AArCY,0CAAe"}
|
|
@@ -1,18 +1,44 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
const util_1 = require("util");
|
|
4
|
+
global.TextEncoder = util_1.TextEncoder;
|
|
5
|
+
global.TextDecoder = util_1.TextDecoder;
|
|
3
6
|
const inject_1 = require("@furystack/inject");
|
|
4
7
|
const utils_1 = require("@furystack/utils");
|
|
5
8
|
const _1 = require("./");
|
|
6
9
|
const jsdom_1 = require("jsdom");
|
|
7
10
|
describe('LocationService', () => {
|
|
11
|
+
const oldDoc = document;
|
|
12
|
+
beforeAll(() => {
|
|
13
|
+
globalThis.document = new jsdom_1.JSDOM().window.document;
|
|
14
|
+
});
|
|
15
|
+
afterAll(() => {
|
|
16
|
+
globalThis.document = oldDoc;
|
|
17
|
+
});
|
|
18
|
+
beforeEach(() => (document.body.innerHTML = '<div id="root"></div>'));
|
|
19
|
+
afterEach(() => (document.body.innerHTML = ''));
|
|
8
20
|
it('Shuld be constructed', async () => {
|
|
9
21
|
await (0, utils_1.usingAsync)(new inject_1.Injector(), async (i) => {
|
|
10
|
-
const dom = new jsdom_1.JSDOM();
|
|
11
|
-
global.window = dom.window;
|
|
12
|
-
i.setExplicitInstance(dom.window, Window);
|
|
13
22
|
const s = i.getInstance(_1.LocationService);
|
|
14
23
|
expect(s).toBeInstanceOf(_1.LocationService);
|
|
15
24
|
});
|
|
16
25
|
});
|
|
26
|
+
it('Shuld update state on events', async () => {
|
|
27
|
+
await (0, utils_1.usingAsync)(new inject_1.Injector(), async (i) => {
|
|
28
|
+
const onLocaionChanged = jest.fn();
|
|
29
|
+
const s = i.getInstance(_1.LocationService);
|
|
30
|
+
s.onLocationChanged.subscribe(onLocaionChanged);
|
|
31
|
+
expect(onLocaionChanged).toBeCalledTimes(0);
|
|
32
|
+
history.pushState(null, '', '/loc1');
|
|
33
|
+
expect(onLocaionChanged).toBeCalledTimes(1);
|
|
34
|
+
history.replaceState(null, '', '/loc2');
|
|
35
|
+
expect(onLocaionChanged).toBeCalledTimes(2);
|
|
36
|
+
// TODO: Figure out testing hashchange and popstate subscriptions
|
|
37
|
+
// window.dispatchEvent(new HashChangeEvent('hashchange', { newURL: '/loc3' }))
|
|
38
|
+
// expect(onLocaionChanged).toBeCalledTimes(3)
|
|
39
|
+
// window.dispatchEvent(new PopStateEvent('popstate', {}))
|
|
40
|
+
// expect(onLocaionChanged).toBeCalledTimes(4)
|
|
41
|
+
});
|
|
42
|
+
});
|
|
17
43
|
});
|
|
18
44
|
//# sourceMappingURL=location-service.spec.js.map
|