TypeScript slim-dom.diffNode函數代碼示例

const patchNodeAndDOM = (oldNode: SlimParentNode, newNode: SlimParentNode, mount: HTMLElement, map: NativeObjectMap) => {
  const diffs = prepDiff(oldNode, diffNode(oldNode, newNode));
  for (const mutation of diffs) {
    map = patchDOM2(mutation, oldNode, mount, map);
    oldNode = patchNode2(mutation, oldNode);
  }

  return { node: oldNode, map };
};

    it(`can diff ${oldSource} against ${newSource}`, async () => {
      const { graph: ag } = await loadModuleDependencyGraph("entry.pc", {
        readFile: () => Promise.resolve(wrapSource(oldSource))
      });
      const { graph: bg } =  await loadModuleDependencyGraph("entry.pc", {
        readFile: () => Promise.resolve(wrapSource(newSource))
      });

      const { document: an } = runPCFile({ entry: {filePath: "entry.pc", componentId: "entry", previewName: "main" }, graph: ag });

      const { document: bn, diagnostics } = runPCFile({ entry: {filePath: "entry.pc", componentId: "entry", previewName: "main" }, graph: bg });

      const diffs = diffNode(an, bn);
      expect(diffs).to.eql(expectedDiffs);
    });

function* getComponentJSONPreviewDiff(req: express.Request, res: express.Response, next) {
  const state: ApplicationState = yield select();
  const { componentId, previewName, oldChecksum, newChecksum } = req.params;
  const oldDocument = getPreviewDocumentByChecksum(componentId, previewName, oldChecksum, state);
  const newDocument = getPreviewDocumentByChecksum(componentId, previewName, newChecksum, state);

  if (!oldDocument) {
    return next();
  }

  if (!newDocument) {
    return next();
  }

  return res.send(diffNode(oldDocument, newDocument));
}

function* evaluatePreviews(graph: DependencyGraph, sourceUri: string) {
  const state: ApplicationState = yield select();
  const moduleSourceDirectory = getModuleSourceDirectory(state);
  for (const filePath in graph) {
    const dep = graph[filePath];
    if (sourceUri && sourceUri !== filePath && values(dep.resolvedImportUris).indexOf(sourceUri) === -1) {
      continue;
    }

    const { module } = dep;
    if (module.type === PCModuleType.COMPONENT) {
      for (const component of (module as ComponentModule).components) {
        for (const preview of component.previews) {
          const entry = {
            componentId: component.id,
            filePath,
            previewName: preview.name
          }
    
          const { document } = runPCFile({ entry, graph, directoryAliases: {

            // TODO - will eventually want to pass host and protocol information here too
            [moduleSourceDirectory]: `http://localhost:${state.options.port}${PUBLIC_SRC_DIR_PATH}`
          } });
          const prevDocument = getLatestPreviewDocument(component.id, preview.name, yield select());
          
          console.log(`Evaluated component ${component.id}:${preview.name}`);

          let newDocument = document as SlimParentNode;

          // TODO - push diagnostics too
          yield put(previewEvaluated(component.id, preview.name, newDocument));

          if (prevDocument) {
            const diff = diffNode(prevDocument, newDocument);

            // push even if there are no diffs so that FE can flag windows as loaded.
            yield put(previewDiffed(component.id, preview.name, getDocumentChecksum(prevDocument), diff));
          }
        }
      }
    }
  }
}