[BUG]: Incorrect node visualization

[cod3nym]

Issue description

When visualizing my JSON data (see example below), one of the array elements is incorrectly rendered as a standalone node. Additionally, an internal array within that element is displayed as a separate node, rather than being nested as a child of the corresponding parent node.

I expect each array element to be rendered as a separate node, with its corresponding child elements correctly attached to it. This behavior is consistent with what I observed when testing the same data in another visualization tool. (see screenshot)

Below is the json data I used

[
  {
    "level": "Warning",
    "module": "Filescan",
    "message": "Malware file found",
    "score": 81,
    "context": {
      "ext": ".lnk",
      "file": "<REDACTED>",
      "firstbytes": "<REDACTED>",
      "md5": "<REDACTED>",
      "reasons_count": 2,
      "sample_id": 4,
      "sha1": "<REDACTED>",
      "sha256": "<REDACTED>",
      "size": 3012,
      "target": "nn.js ",
      "type": "LNK"
    },
    "matches": [
      {
        "author": "Jonathan Peters (cod3nym)",
        "matched": [
          "<REDACTED>,",
          "<REDACTED>"
        ],
        "reason": "<REDACTED>",
        "ref": "<REDACTED>",
        "ruledate": "2025-05-06",
        "rulename": "<REDACTED>",
        "sigclass": "YARA Rule",
        "sigtype": "custom",
        "subscore": 70
      },
      {
        "author": "Jonathan Peters (cod3nym)",
        "matched": null,
        "reason": "<REDACTED>",
        "ref": "<REDACTED>",
        "ruledate": "2025-05-08",
        "rulename": "<REDACTED>",
        "sigclass": "YARA Rule",
        "sigtype": "custom",
        "subscore": 70
      }
    ]
  }
]

Operating system

• OS: Fedora Linux GNOME
• Browser: Firefox

Priority this issue should have

Medium

[AykutSarac]

It probably happens because it's skipping the null field, I recently pushed an update to hide empty array and objects, however it's not supposed to effect null values.

The tool you used is probably a clone of JSON Crack of older versions, I appreciate if you can share the tool link to review if they follow our LICENSE.

[oleole39]

Hello @AykutSarac ,

I find a similar issue on Firefox-based browsers with below data, resulting in some properties (capitalCity, longitude and latitude) getting associated to the wrong node in the vizualisation (it should instead be associated to the nodes where the pink arrows are pointing to in the attached screenshot).

For test purposes I have also tried removing the array imbrication and adminregion block (which has empty values), but that does not help.

Tested on 26/05/2025 at https://jsoncrack.com/editor.
Trying the same with a Chromium-based browser shows the expected result - it seems to be a Firefox-only bug.

Related to #460 and maybe #468 as well.

Display JSON data

[
  {
    "page": 1,
    "pages": 1,
    "per_page": "304",
    "total": 296
  },
  [
    {
      "id": "ABW",
      "iso2Code": "AW",
      "name": "Aruba",
      "region": {
        "id": "LCN",
        "iso2code": "ZJ",
        "value": "Latin America & Caribbean "
      },
      "adminregion": {
        "id": "",
        "iso2code": "",
        "value": ""
      },
      "incomeLevel": {
        "id": "HIC",
        "iso2code": "XD",
        "value": "High income"
      },
      "lendingType": {
        "id": "LNX",
        "iso2code": "XX",
        "value": "Not classified"
      },
      "capitalCity": "Oranjestad",
      "longitude": "-70.0167",
      "latitude": "12.5167"
    },
    {
      "id": "FIN",
      "iso2Code": "FI",
      "name": "Finland",
      "region": {
        "id": "ECS",
        "iso2code": "Z7",
        "value": "Europe & Central Asia"
      },
      "adminregion": {
        "id": "",
        "iso2code": "",
        "value": ""
      },
      "incomeLevel": {
        "id": "HIC",
        "iso2code": "XD",
        "value": "High income"
      },
      "lendingType": {
        "id": "LNX",
        "iso2code": "XX",
        "value": "Not classified"
      },
      "capitalCity": "Helsinki",
      "longitude": "24.9525",
      "latitude": "60.1608"
    }
  ]
]

[AykutSarac]

Can you try now, could be fixed with #490?

[oleole39]

Can you try now, could be fixed with #490?

If the version you meant is the one currently living on https://jsoncrack.com/editor, I confirm the issue has now disappeared on Firefox (tested with FF v140)!