{page.title}

+ console.log('hi'), {objected: true}]} + > + {this.hydrated &&

} + + WindowFragment + + {this.visible && ( + +

+ WindowFragment2 +

+ + )} + home + +

+ ) + } + +} + +export default WindowFragment diff --git a/tests/src/WindowFragment.test.js b/tests/src/WindowFragment.test.js new file mode 100644 index 00000000..ff3d399e --- /dev/null +++ b/tests/src/WindowFragment.test.js @@ -0,0 +1,32 @@ +beforeEach(async () => { + await page.goto('http://localhost:6969/window-fragment') +}) + +describe('WindowFragment', () => { + test('the window behaves as a fragment and creates no markup', async () => { + const element = await page.$('[data-window-parent] > [data-window-child]') + expect(element).toBeTruthy() + }) + + test('the window ignores non attribute events', async () => { + const element = await page.$('[data-window-parent] > [data-window-child]') + expect(element).toBeTruthy() + }) + + test('when the window is nested events are invoked sequentially', async () => { + await page.waitForSelector('[data-hydrated]') + await page.click('body') + await page.waitForSelector('[data-count="1"][data-objected]') + const element = await page.$('[data-count="1"][data-objected]') + expect(element).toBeTruthy() + }) + + test('the window removes events when the fragment leaves the tree', async () => { + await page.waitForSelector('[data-hydrated]') + await page.click('[href="/"]') + await page.waitForSelector('[data-application-hydrated]:not([data-count])') + await page.click('body') + const element = await page.$('[data-application-hydrated]:not([data-count])') + expect(element).toBeTruthy() + }) +}) From 16ea9cb4a14d35ccf5c998e46ddd379144486790 Mon Sep 17 00:00:00 2001 From: Maycon Sousa Date: Mon, 22 May 2023 11:48:30 -0300 Subject: [PATCH 7/9] replace ts types for interfaces --- types/ClientContext.d.ts | 7 +++++-- types/Environment.d.ts | 2 +- types/Instances.d.ts | 1 + types/Page.d.ts | 2 +- types/Plugin.d.ts | 4 ++-- types/Project.d.ts | 2 +- types/Request.d.ts | 3 +++ types/Response.d.ts | 3 +++ types/Router.d.ts | 2 +- types/Secrets.d.ts | 2 +- types/Server.d.ts | 2 +- types/ServerContext.d.ts | 10 +++++++--- types/Settings.d.ts | 2 +- types/Worker.d.ts | 2 +- types/index.d.ts | 3 +++ 15 files changed, 32 insertions(+), 15 deletions(-) create mode 100644 types/Instances.d.ts create mode 100644 types/Request.d.ts create mode 100644 types/Response.d.ts diff --git a/types/ClientContext.d.ts b/types/ClientContext.d.ts index ea3f62a6..9caace1b 100644 --- a/types/ClientContext.d.ts +++ b/types/ClientContext.d.ts @@ -1,4 +1,5 @@ import { NullstackEnvironment } from './Environment' +import { NullstackInstances } from './Instances' import { NullstackFragment } from './JSX' import { NullstackPage } from './Page' import { NullstackParams } from './Params' @@ -10,7 +11,7 @@ import { NullstackWorker } from './Worker' /** * @see https://nullstack.app/context */ -export type NullstackClientContext = TProps & { +interface BaseNullstackClientContext { /** * Callback function that bootstrap the context for the application. */ @@ -53,7 +54,7 @@ export type NullstackClientContext = TProps & { * @scope client * @see https://nullstack.app/context-instances */ - instances: Record + instances: NullstackInstances /** * It gives you information about the current environment. @@ -129,3 +130,5 @@ export type NullstackClientContext = TProps & { element?: HTMLElement } + +export type NullstackClientContext = BaseNullstackClientContext & TProps \ No newline at end of file diff --git a/types/Environment.d.ts b/types/Environment.d.ts index db962150..f761598d 100644 --- a/types/Environment.d.ts +++ b/types/Environment.d.ts @@ -1,4 +1,4 @@ -export type NullstackEnvironment = { +export interface NullstackEnvironment { client: boolean server: boolean diff --git a/types/Instances.d.ts b/types/Instances.d.ts new file mode 100644 index 00000000..1b5d7dc9 --- /dev/null +++ b/types/Instances.d.ts @@ -0,0 +1 @@ +export interface NullstackInstances extends Record {} \ No newline at end of file diff --git a/types/Page.d.ts b/types/Page.d.ts index c78e5db6..0d3a0747 100644 --- a/types/Page.d.ts +++ b/types/Page.d.ts @@ -1,4 +1,4 @@ -export type NullstackPage = { +export interface NullstackPage { /** * Current page title * diff --git a/types/Plugin.d.ts b/types/Plugin.d.ts index bf680ac2..dbdcefb6 100644 --- a/types/Plugin.d.ts +++ b/types/Plugin.d.ts @@ -1,7 +1,7 @@ import { NullstackClientContext } from './ClientContext' import { AllHTMLAttributes, NullstackAttributes } from './JSX' -type NullstackPluginNode = { +interface NullstackPluginNode { type: string | boolean attributes: AllHTMLAttributes & NullstackAttributes children: NullstackClientContext['children'] @@ -11,7 +11,7 @@ interface NullstackNodeContext extends NullstackClientContext { node: NullstackPluginNode } -export type NullstackPlugin = { +export interface NullstackPlugin { /** * Runs transformation to node element * @param context Context with node attributes diff --git a/types/Project.d.ts b/types/Project.d.ts index a20b04d9..cd282da4 100644 --- a/types/Project.d.ts +++ b/types/Project.d.ts @@ -1,4 +1,4 @@ -export type NullstackProject = { +export interface NullstackProject { domain: string /** diff --git a/types/Request.d.ts b/types/Request.d.ts new file mode 100644 index 00000000..ea864563 --- /dev/null +++ b/types/Request.d.ts @@ -0,0 +1,3 @@ +import { Request } from 'express' + +export interface NullstackRequest extends Request {} \ No newline at end of file diff --git a/types/Response.d.ts b/types/Response.d.ts new file mode 100644 index 00000000..15458b80 --- /dev/null +++ b/types/Response.d.ts @@ -0,0 +1,3 @@ +import { Response } from 'express' + +export interface NullstackResponse extends Response {} \ No newline at end of file diff --git a/types/Router.d.ts b/types/Router.d.ts index 216b36f4..38dab493 100644 --- a/types/Router.d.ts +++ b/types/Router.d.ts @@ -1,4 +1,4 @@ -export type NullstackRouter = { +export interface NullstackRouter { /** * The router path including query params. * Does not contain the domain and port. diff --git a/types/Secrets.d.ts b/types/Secrets.d.ts index 349e2f5c..d1b8ecb5 100644 --- a/types/Secrets.d.ts +++ b/types/Secrets.d.ts @@ -1 +1 @@ -export type NullstackSecrets = Record +export interface NullstackSecrets extends Record {} diff --git a/types/Server.d.ts b/types/Server.d.ts index b6470951..56007c19 100644 --- a/types/Server.d.ts +++ b/types/Server.d.ts @@ -1,4 +1,4 @@ -export type NullstackServer = { +export interface NullstackServer { get(...args) post(...args) diff --git a/types/ServerContext.d.ts b/types/ServerContext.d.ts index 8ec90589..5a84f660 100644 --- a/types/ServerContext.d.ts +++ b/types/ServerContext.d.ts @@ -1,5 +1,7 @@ import { NullstackEnvironment } from './Environment' import { NullstackProject } from './Project' +import { NullstackRequest } from './Request' +import { NullstackResponse } from './Response' import { NullstackSecrets } from './Secrets' import { NullstackServer } from './Server' import { NullstackSettings } from './Settings' @@ -8,7 +10,7 @@ import { NullstackWorker } from './Worker' /** * @see https://nullstack.app/context */ -export type NullstackServerContext = TProps & { +interface BaseNullstackServerContext { /** * Callback function that bootstrap the context for the application. */ @@ -49,7 +51,7 @@ export type NullstackServerContext = TProps & { * @scope server * @see https://nullstack.app/server-request-and-response */ - request?: Record + request?: NullstackRequest /** * Original `response` object from [Express](https://expressjs.com/) @@ -57,7 +59,7 @@ export type NullstackServerContext = TProps & { * @scope server * @see https://nullstack.app/server-request-and-response */ - response?: Record + response?: NullstackResponse /** * You can assign any key with any type of public information. @@ -83,3 +85,5 @@ export type NullstackServerContext = TProps & { */ secrets: NullstackSecrets } + +export type NullstackServerContext = BaseNullstackServerContext & TProps \ No newline at end of file diff --git a/types/Settings.d.ts b/types/Settings.d.ts index efe88216..cf699bcc 100644 --- a/types/Settings.d.ts +++ b/types/Settings.d.ts @@ -1 +1 @@ -export type NullstackSettings = Record +export interface NullstackSettings extends Record {} diff --git a/types/Worker.d.ts b/types/Worker.d.ts index b4999345..77ac02e2 100644 --- a/types/Worker.d.ts +++ b/types/Worker.d.ts @@ -1,4 +1,4 @@ -export type NullstackWorker = { +export interface NullstackWorker { /** * - keys: server functions names * - values: array of these functions arguments diff --git a/types/index.d.ts b/types/index.d.ts index 1a46f414..b2243c41 100644 --- a/types/index.d.ts +++ b/types/index.d.ts @@ -5,10 +5,13 @@ import { NullstackServerContext } from './ServerContext' export * from './ClientContext' export * from './Environment' +export * from './Instances' export * from './Page' export * from './Params' export * from './Plugin' export * from './Project' +export * from './Request' +export * from './Response' export * from './Router' export * from './Secrets' export * from './Server' From eb2fd96045d780d7f132fb699be0be4b8ef31c5b Mon Sep 17 00:00:00 2001 From: Christian Mortaro Date: Tue, 23 May 2023 16:04:55 -0300 Subject: [PATCH 8/9] :sparkles: bind date --- client/events.js | 6 ++++++ plugins/bindable.js | 5 +++++ tests/src/TwoWayBindings.njs | 9 +++++++++ tests/src/TwoWayBindings.test.js | 15 +++++++++++++++ 4 files changed, 35 insertions(+) diff --git a/client/events.js b/client/events.js index 874e0788..718c2850 100644 --- a/client/events.js +++ b/client/events.js @@ -67,6 +67,12 @@ export function generateCallback(selector, name) { object[property] = event.target[valueName] === 'true' } else if (typeof object[property] === 'number') { object[property] = +event.target[valueName] || 0 + } else if (object[property] instanceof Date) { + const [yyyy, mm, dd] = event.target[valueName].split('-') + object[property].setFullYear(yyyy) + object[property].setMonth(+mm - 1) + object[property].setDate(dd) + object[property] = object[property] } else { object[property] = event.target[valueName] } diff --git a/plugins/bindable.js b/plugins/bindable.js index b3424084..1f8b27c7 100644 --- a/plugins/bindable.js +++ b/plugins/bindable.js @@ -12,6 +12,11 @@ function transform({ node, environment }) { node.children = [object[property] ?? ''] } else if (node.type === 'input' && node.attributes.type === 'checkbox') { node.attributes.checked = object[property] + } else if (node.type === 'input' && node.attributes.type === 'date' && object[property] instanceof Date) { + const yyyy = object[property].getFullYear() + const mm = (object[property].getMonth() + 1).toString().padStart(2, '0') + const dd = object[property].getDate().toString().padStart(2, '0') + node.attributes.value = `${yyyy}-${mm}-${dd}` } else { node.attributes.value = object[property] ?? '' } diff --git a/tests/src/TwoWayBindings.njs b/tests/src/TwoWayBindings.njs index 64a77596..a7a4d352 100644 --- a/tests/src/TwoWayBindings.njs +++ b/tests/src/TwoWayBindings.njs @@ -9,6 +9,7 @@ class TwoWayBindings extends Nullstack { boolean = true character = 'a' text = 'aaaa' + date = new Date() object = { count: 1 } array = ['a', 'b', 'c'] @@ -143,6 +144,14 @@ class TwoWayBindings extends Nullstack { > rebounce +