npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

json-diff-ts

v4.1.0

Published

A JSON diff tool for JavaScript written in TypeScript.

Downloads

271,368

Readme

json-diff-ts

Master CI/Publish Known Vulnerabilities Quality Gate Status

json-diff-ts is a TypeScript library that calculates and applies differences between JSON objects. A standout feature is its ability to identify elements in arrays using keys instead of indices, which offers a more intuitive way to handle arrays. It also supports JSONPath, a query language for JSON, which enables you to target specific parts of a JSON document with precision.

Another significant feature of this library is its ability to transform changesets into atomic changes. This means that each change in the data can be isolated and applied independently, providing a granular level of control over the data manipulation process.

This library is particularly valuable for applications where tracking changes in JSON data is crucial. It simplifies the process of comparing JSON objects and applying changes. The support for key-based array identification can be especially useful in complex JSON structures where tracking by index is not efficient or intuitive. JSONPath support further enhances its capabilities by allowing precise targeting of specific parts in a JSON document, making it a versatile tool for handling JSON data.

Starting with version 3, json-diff-ts now supports both ECMAScript Modules and CommonJS. This makes the library more versatile and compatible with various JavaScript environments. Whether you're working in a modern project that uses ES modules, or a Node.js project that uses CommonJS, you can now use json-diff-ts seamlessly.

Installation

npm install json-diff-ts

In TypeScript or ES Modules, you can import the diff function like this:

import { diff } from 'json-diff-ts';

In CommonJS, you can import the diff function like this:

const { diff } = require('json-diff-ts');

Capabilities

diff

Generates a difference set for JSON objects. When comparing arrays, if a specific key is provided, differences are determined by matching elements via this key rather than array indices.

Examples using Star Wars data:

import { diff } from 'json-diff-ts';

const oldData = {
  planet: 'Tatooine',
  faction: 'Jedi',
  characters: [
    { id: 'LUK', name: 'Luke Skywalker', force: true },
    { id: 'LEI', name: 'Leia Organa', force: true }
  ],
  weapons: ['Lightsaber', 'Blaster']
};

const newData = {
  planet: 'Alderaan',
  faction: 'Rebel Alliance',
  characters: [
    { id: 'LUK', name: 'Luke Skywalker', force: true, rank: 'Commander' },
    { id: 'HAN', name: 'Han Solo', force: false }
  ],
  weapons: ['Lightsaber', 'Blaster', 'Bowcaster']
};

const diffs = diff(oldData, newData, { embeddedObjKeys: { characters: 'id' } });

const expectedDiffs = [
  {
    type: 'UPDATE',
    key: 'planet',
    value: 'Alderaan',
    oldValue: 'Tatooine'
  },
  {
    type: 'UPDATE',
    key: 'faction',
    value: 'Rebel Alliance',
    oldValue: 'Jedi'
  },
  {
    type: 'UPDATE',
    key: 'characters',
    embeddedKey: 'id',
    changes: [
      {
        type: 'UPDATE',
        key: 'LUK',
        changes: [
          {
            type: 'ADD',
            key: 'rank',
            value: 'Commander'
          }
        ]
      },
      {
        type: 'ADD',
        key: 'HAN',
        value: {
          id: 'HAN',
          name: 'Han Solo',
          force: false
        }
      },
      {
        type: 'REMOVE',
        key: 'LEI',
        value: {
          id: 'LEI',
          name: 'Leia Organa',
          force: true
        }
      }
    ]
  },
  {
    type: 'UPDATE',
    key: 'weapons',
    embeddedKey: '$index',
    changes: [
      {
        type: 'ADD',
        key: '2',
        value: 'Bowcaster'
      }
    ]
  }
];

Advanced

Paths can be utilized to identify keys within nested arrays.

const diffs = diff(oldData, newData, { embeddedObjKeys { 'characters.subarray': 'id' }});

You can also designate the root by using '.' instead of an empty string ('').

const diffs = diff(oldData, newData, { embeddedObjKeys: { '.characters.subarray': 'id' } });

Determine if type changes are treated as a replace (remove, add) or as an update; default is replace.

const diffs = diff(oldData, newData, { treatTypeChangeAsReplace: false });

You can use a function to dynamically resolve the key of the object. The first parameter is the object and the second is to signal if the function should return the key name instead of the value. This is needed to flatten the changeset

const diffs = diff(oldData, newData, {
  embeddedObjKeys: {
    characters: (obj, shouldReturnKeyName) => (shouldReturnKeyName ? 'id' : obj.id)
  }
});

If you're using the Map type, you can employ regular expressions for path identification.

const embeddedObjKeys: EmbeddedObjKeysMapType = new Map();

embeddedObjKeys.set(/^char\w+$/, 'id'); // instead of 'id' you can specify a function

const diffs = diff(oldObj, newObj, { embeddedObjKeys });

Compare string arrays by value instead of index

const diffs = diff(oldObj, newObj, { embeddedObjKeys: { stringArr: '$value' } });

atomizeChangeset

Transforms a complex changeset into a list of atomic changes, each describable by a JSONPath.

Examples:

const atomicChanges = atomizeChangeset(diffs);
// Restore the changeset from a selection of atomic changes
const changeset = unatomizeChangeset(flatChanges.slice(0, 3));
// Alternatively, apply the changes using a JSONPath-capable library
// ...

Atomic Changes will have the following structure:

[
  { type: 'UPDATE', key: 'planet', value: 'Alderaan', oldValue: 'Tatooine', path: '$.planet', valueType: 'String' },
  // ... Additional flat changes here
  { type: 'ADD', key: 'rank', value: 'Commander', path: "$.characters[?(@.id=='LUK')].rank", valueType: 'String' }
];

applyChange

Examples:

const oldData = {
  // ... Initial data here
};

// Sample diffs array, similar to the one generated in the diff example
const diffs = [
  // ... Diff objects here
];

changesets.applyChanges(oldData, diffs);

expect(oldData).to.eql({
  // ... Updated data here
});

revertChange

Examples:

const newData = {
  // ... Updated data here
};

// Sample diffs array
const diffs = [
  // ... Diff objects here
];

changesets.revertChanges(newData, diffs);

expect(newData).to.eql({
  // ... Original data restored here
});

jsonPath

The json-diff-ts library uses JSONPath to address specific parts of a JSON document in both the changeset and the application/reversion of changes.

Examples:


const jsonPath = changesets.jsonPath;

cost data = {
  // ... Some JSON data
};

const value = jsonPath.query(data, '$.characters[?(@.id=="LUK")].name');

expect(value).to.eql(['Luke Skywalker']);

Contributing

Contributions are welcome! Please follow the provided issue templates and code of conduct.

Contact

Reach out to the maintainer via LinkedIn or Twitter:

Discover more about the company behind this project: hololux

Release Notes

  • v4.0.0: Change naming of flattenChangest and unflattenChanges to atomizeChangeset and unatomizeChangeset; option to set treatTypeChangeAsReplace
  • v3.0.1: Fix issue with unflattenChanges when a key has periods
  • v3.0.0: Supports CommonJS and ECMAScript Modules. Dependency to lodash-es was replaced with lodash to support both ECMAScript and CommonJS.
  • v2.2.0: Fix lodash-es decependency, exclude keys, compare string arrays by value
  • v2.1.0: Resolves a problem related to JSON Path filters by replacing the single equal sign (=) with a double equal sign (==). This update maintains compatibility with existing flat changes. Allows to use either '' or '.' as root in the path.
  • v2.0.0: json-diff-ts has been upgraded to an ECMAScript module! This major update brings optimizations and enhanced documentation. Additionally, a previously existing issue where all paths were treated as regex has been fixed. In this new version, you'll need to use a Map instead of a Record for regex paths. Please note that this is a breaking change if you were using regex paths in the previous versions.
  • v1.2.6: Enhanced JSON Path handling for period-inclusive segments.
  • v1.2.5: Patched dependencies; added key name resolution support for key functions.
  • v1.2.4: Documentation updates; upgraded TypeScript and Lodash.
  • v1.2.3: Dependency updates; switched to TypeScript 4.5.2.
  • v1.2.2: Implemented object key resolution functions support.

Acknowledgments

This project takes inspiration and code from diff-json by [email protected].

License

json-diff-ts is open-sourced software licensed under the MIT license.

The original diff-json project is also under the MIT License. For more information, refer to its license details.