implab/implabjs-djx Commit - r122:fb2ea4d6aaba

Fixed scheduleRender context restoration

cin -

r122:fb2ea4d6aaba v1.6.3 default

parent child

Context file:

r122:fb2ea4d6aaba

Collapse all files

The requested changes are too big and content was truncated. Show full diff

djx/package-lock.json 0 0

	1		NO CONTENT: modified file
The requested commit or file is too big and content was truncated. Show full diff

djx/package.json +1 -1

              {
                  "name": "@implab/djx",
                  "version": "0.0.1-dev",
                  "description": "Supports using dojo version 1 with typescript and .tsx files",
                  "keywords": [
                      "dojo",
                      "tsx",
                      "typescript",
                      "widgets"
                  ],
                  "author": "Implab team",
                  "license": "BSD-2-Clause",
                  "repository": "https://code.implab.org/implab/implabjs-djx",
                  "publishConfig": {
                      "access": "public"
                  },
                  "peerDependencies": {
                      "@implab/core-amd": "^1.4.6",
                      "dojo": "^1.10.0"
                  },
                  "devDependencies": {
                      "@implab/core-amd": "^1.4.6",
                      "@types/chai": "4.1.3",
                      "@types/requirejs": "2.1.31",
                      "@types/yaml": "1.2.0",
                      "@types/tap": "15.0.7",
                      "rxjs": "7.5.6",
                      "dojo": "1.16.0",
                      "@implab/dojo-typings": "1.0.3",
                      "@typescript-eslint/eslint-plugin": "^5.23.0",
                      "@typescript-eslint/parser": "^5.23.0",
-                     "eslint": "^8.23.0",
+                     "eslint": "^8.28.0",
                      "eslint-config-standard": "^17.0.0",
                      "eslint-plugin-import": "^2.26.0",
                      "eslint-plugin-n": "^15.2.0",
                      "eslint-plugin-promise": "^6.0.0",
                      "eslint-plugin-react": "^7.29.4",
                      "requirejs": "2.3.6",
                      "typescript": "4.8.3",
                      "yaml": "~1.7.2",
                      "tap": "16.3.0"
                  }
              }

djx/src/main/ts/i18n.ts +4 -3

              import { id as mid} from "module";
              import {  PromiseOrValue } from "@implab/core-amd/interfaces";
              import {  NlsBundle } from "./NlsBundle";
              import { isPromise } from "@implab/core-amd/safe";
              import { locale as sysLocale } from "dojo/_base/kernel";
              import { TraceSource } from "@implab/core-amd/log/TraceSource";
              const trace = TraceSource.get(mid);
              trace.debug("Current sysLocale: {0}", sysLocale);
              export interface OnLoad {
                  (result?: unknown): void;
                  error(err: unknown): void;
              }
              export const bundle = <T extends object>(nls: T, locales?: Record<string, () => PromiseOrValue<object>>) : {
-                 i18n: (locale?: string) => T;
-                 define: (pack: Partial<T>) => object;
-                 load: (id: string, require: Require, cb: OnLoad, config: {isBuild?: boolean}) => void;
+                 i18n: (this: void, locale?: string) => T;
+                 define: (this: void, pack: Partial<T>) => object;
+                 load: (this: void, id: string, require: Require, cb: OnLoad, config: {isBuild?: boolean}) => void;
              } => {
                  const nlsBundle = new NlsBundle(nls, locales);
                  const fn = (_locale?: string) => {
                      const locale = _locale || sysLocale;
                      const result = nlsBundle.getLocale(locale);
                      if (isPromise(result))
                          throw new Error(`The bundle '${locale}' isn't loaded`);
                      else
                          return result;
                  };
                  fn.i18n = fn;
+                 fn.nls = fn;
                  fn.define = (pack: Partial<T>): object => pack;
                  fn.load = async (id: string, require: Require, cb: OnLoad, config: {isBuild?: boolean}) => {
                      const locale = id || sysLocale;
                      if (config && config.isBuild) {
                          cb();
                      } else {
                          try {
                              await nlsBundle.getLocale(locale);
                              cb();
                          } catch (e) {
                              if(cb.error) {
                                  cb.error(e);
                              } else {
                                  // in case the loader doesn't support error reporting
                                  trace.error("Error loading {0}: {1}", locale, e);
                              }
                          }
                      }
                  };
                  return fn;
              };

djx/src/main/ts/tsx/render.ts +2 -1

              import { TraceSource } from "@implab/core-amd/log/TraceSource";
              import { isPromise } from "@implab/core-amd/safe";
              import { id as mid } from "module";
              import { IScope, Scope } from "./Scope";
              import { isNode, isRendition, isWidget } from "./traits";
              const trace = TraceSource.get(mid);
              interface Context {
                  readonly scope: IScope;
                  readonly hooks?: (() => void)[];
              }
              let _context: Context = {
                  scope: Scope.dummy
              };
              let _renderCount = 0;
              let _renderId = 1;
              let _renderedHooks: (() => void)[] = [];
              const guard = (cb: () => unknown) => {
                  try {
                      const result = cb();
                      if (isPromise(result)) {
                          const warn = (ret: unknown) => trace.error("The callback {0} competed asynchronously. result = {1}", cb, ret);
                          result.then(warn, warn);
                      }
                  } catch (e) {
                      trace.error(e);
                  }
              };
              /**
               *
               * @param scope
               * @returns
               */
              export const beginRender = (scope = getScope()) => {
                  const prev = _context;
                  _renderCount++;
                  const renderId = _renderId++;
                  trace.debug("beginRender [{0}], pending = {1}", renderId, _renderCount);
                  if (_renderCount === 1)
                      onRendering();
                  _context = {
                      scope,
                      hooks: []
                  };
                  return endRender(prev, _context, renderId);
              };
              /**
               * Method for a deferred rendering. Returns a promise with `beginRender()` function.
               * Call to `scheduleRender` will save the current context, and will increment pending
               * operations counter.
               *
               * @example
               *
               * const begin = await scheduleRender();
               * const end = begin();
               * try {
               *     // do some DOM manipulations
               * } finally {
               *     end();
               * }
               *
               * @param scope
               * @returns
               */
              export const scheduleRender = async (scope = getScope()) => {
-                 const prev = _context;
                  _renderCount++;
                  const renderId = _renderId ++;
                  trace.debug("scheduleRender [{0}], pending = {1}", renderId, _renderCount);
                  if (_renderCount === 1)
                      onRendering();
                  await Promise.resolve();
                  return () => {
                      trace.debug("beginRender [{0}], pending = {1}", renderId, _renderCount);
+                     const prev = _context;
                      _context = {
                          scope,
                          hooks: []
                      };
                      return endRender(prev, _context, renderId);
                  };
              };
              /**
               * Completes render operation
               */
              const endRender = (prev: Context, current: Context, renderId: number) => () => {
                  if (_context !== current)
                      trace.error("endRender mismatched beginRender call");
                  const { hooks } = _context;
                  if (hooks)
                      hooks.forEach(guard);
                  _renderCount--;
                  _context = prev;
                  trace.debug("endRender [{0}], pending = {1}", renderId, _renderCount);
                  if (_renderCount === 0)
                      onRendered();
              };
              // called when the first beginRender is called for this iteration
              const onRendering = () => {
                  setTimeout(() => {
                      if (_renderCount !== 0)
                          trace.error("Rendering tasks aren't finished, currently running = {0}", _renderCount);
                  });
              };
              // called when all render operations are complete
              const onRendered = () => {
                  _renderedHooks.forEach(guard);
                  _renderedHooks = [];
              };
              export const whenRendered = () => new Promise<void>((resolve) => {
                  if (_renderCount)
                      _renderedHooks.push(resolve);
                  else
                      resolve();
              });
              export const renderHook = (hook: () => void) => {
                  const { hooks } = _context;
                  if (hooks)
                      hooks.push(hook);
                  else
                      guard(hook);
              };
              export const refHook = <T>(value: T, ref: JSX.Ref<T>) => {
                  const { hooks, scope } = _context;
                  if (hooks)
                      hooks.push(() => ref(value));
                  else
                      guard(() => ref(value));
                  scope.own(() => ref(undefined));
              };
              /** Returns the current scope */
              export const getScope = () => _context.scope;
              /** Schedules the rendition to be rendered to the DOM Node
               * @param rendition The rendition to be rendered
               * @param scope The scope
               */
              export const render = (rendition: unknown, scope = Scope.dummy) => {
                  const complete = beginRender(scope);
                  try {
                      return getItemDom(rendition);
                  } finally {
                      complete();
                  }
              };
              const emptyFragment = document.createDocumentFragment();
              /** Renders DOM element for different types of the argument. */
              export const getItemDom = (v: unknown) => {
                  if (typeof v === "string" || typeof v === "number" || v instanceof RegExp || v instanceof Date) {
                      // primitive types converted to the text nodes
                      return document.createTextNode(v.toString());
                  } else if (isNode(v)) {
                      // nodes are kept as is
                      return v;
                  } else if (isRendition(v)) {
                      // renditions are instantiated
                      return v.getDomNode();
                  } else if (isWidget(v)) {
                      // widgets are converted to it's markup
                      return v.domNode;
                  } else if (typeof v === "boolean" || v === null || v === undefined) {
                      // null | undefined | boolean are removed
                      return emptyFragment;
                  } else if (v instanceof Array) {
                      // arrays will be translated to document fragments
                      const fragment = document.createDocumentFragment();
                      v.map(item => getItemDom(item))
                          .forEach(node => fragment.appendChild(node));
                      return fragment;
                  } else {
                      // bug: explicit error otherwise
                      throw new Error(`Invalid parameter: ${String(v)}`);
                  }
              };

playground/package-lock.json 0 0

	1		NO CONTENT: modified file
The requested commit or file is too big and content was truncated. Show full diff

General Comments 0

Write
Preview

You need to be logged in to leave comments. Login now

No TODOs yet

	Site-wide shortcuts
/	Use quick search box
g h	Goto home page
g g	Goto my private gists page
g G	Goto my public gists page
g 0-9	Goto bookmarked items from 0-9
n r	New repository page
n g	New gist page

	Repositories
g s	Goto summary page
g c	Goto changelog page
g f	Goto files page
g F	Goto files page with file search activated
g p	Goto pull requests page
g o	Goto repository settings
g O	Goto repository access permissions settings
t s	Toggle sidebar on some pages