DEV Community: Kuldeep Singh

Invisible Character Bugs

Kuldeep Singh — Sat, 21 Mar 2026 15:41:15 +0000

This week I ran into a surprisingly interesting bug while working on a feature that generates diffs for history changes in comments, description.

The Setup

We have a system that tracks history changes in back-end. Whenever there’s a modification, we generate a diff and send both the old and new values to the front-end. The initial content follows a simple template:

Task {id}: Working on abc\n
Data: {data}\n

If anything changes, the diff should reflect it clearly.

The Problem

While testing, I noticed something odd.

Even when no changes were made—just clicking the Save button for first time in FE —the system still generated a diff. The front-end showed differences between the "old" and "new" values, even though the text looked identical.

At first, I checked the strings using console logs. Everything appeared normal. No visible differences.

After spending some time debugging, I copied the API response and inspected it more closely. That’s when I noticed the issue:

The old version used \n (LF – Line Feed) - system generate initially
The new version used \r\n (CRLF – Carriage Return + Line Feed) - user update other things once from FE

So even though the text looked the same, the underlying newline characters were different—causing the diff algorithm to treat them as changes.

Root Cause

The culprit turned out to be the browser.

When using a <textarea> in the front-end, browsers normalize line endings to \r\n as part of the HTML specification. So even if the user doesn’t modify anything and simply clicks save, the value retrieved from the textarea contains \r\n line endings.

This behavior is expected and standardized across browsers.

The Fix

The solution was simple: normalize line endings before sending data to the API or in BE.

text.replace(/\r\n/g, '\n')

By converting everything to \n, we ensured consistent comparisons and eliminated false diffs.

Zero-Width Unicode Characters

A while back, I encountered another tricky issue related to invisible characters.

Some data in our database someone has added zero-width Unicode characters (like zero-width space or joiners). These characters are not visible when rendering text, but they still exist in the string and can affect comparisons, search, and validation logic.

We eventually had to scan the entire database table to identify and clean such entries.

Takeaway

This bug was a great reminder that:

Invisible characters can cause very visible issues
Browsers follow standards that may not always align with back-end assumptions
Normalizing input data is crucial when doing string comparisons
Watch-out for Unicode 😁

Original post:- https://www.kuldeepdev407.com/blog/invisible-character-bugs/

Remove all node_modules folder from PC

Kuldeep Singh — Fri, 24 May 2024 06:14:00 +0000

If you ever thing that there are a lot of project you are working and you have lot of node_modules folder you have to delete to save up space when you only have 512SSD.

Here is a python script for deleting all those node_modules folder.

import os
import argparse
import shutil

all_node_path = []
block_path = ['$RECYCLE.BIN','System Volume Information']

def getNodeModulesPaths(path):    
    try:
        with os.scandir(path) as entries:
            for entry in entries:
                if entry.is_dir():
                    if(entry.name == 'node_modules'):
                        all_node_path.append(entry.path)
                    elif(entry.name in block_path):
                        continue
                    else:
                        getNodeModulesPaths(path+'/'+entry.name)
        return 1
    except Exception as e:
        print(f"An error occurred: {e}")
        return []

def remove_directory(directory_path):
    try:
        shutil.rmtree(directory_path)
        print(f"'{directory_path}' removed successfully.")
    except OSError as e:
        print(f"Error: {directory_path} : {e.strerror}")
def main():
    # arguments
    args_parser = argparse.ArgumentParser(description="CLI tool for removing all node_module folder for given path")
    args_parser.add_argument('-p', '--path', required=True, type=str,help="full path from where you want to remove node_module ")

    args = args_parser.parse_args()
    getNodeModulesPaths(args.path)
    for path in all_node_path:
        print(path)

    total_paths = len(all_node_path)

    confirm_rm = input("Are you sure you want to delete above "+str(total_paths)+" folder(y/n):").lower()
    if(confirm_rm == 'y'):
        for path in all_node_path:
            remove_directory(path)
        print("Removed "+str(total_paths)+' node_modules successfully!')
    return 1  
if __name__ == "__main__":
    main()

How to use it

Just run python main.py -p '<pathtofolder>' it is going to scan all node_modules folder in path and going to delete them.

Run it carefully also check the folders before confirming

Here is GitHub link for repo: github.com/kuldeepdev407/rm_node_modules

If i missed something in code feel free to create Issue Or PR.

Download file using curl

Kuldeep Singh — Tue, 26 Mar 2024 20:23:00 +0000

Sometime i need to use curl to download things from web as a developer here is a quick command if you forget it.

curl -o <outputfilename> <downloadlink>

download & extract with same command

curl -L <downloadfileurl> | tar zx

also if it is zip file that you are downloading, You can use below tar command:

tar -xf archive.tar

Resolve Installing psych 5.1.2 with native extensions Gem::Ext::BuildError

Kuldeep Singh — Thu, 21 Mar 2024 21:14:00 +0000

If your are getting below error in rails

Installing psych 5.1.2 with native extensions
Gem::Ext::BuildError: ERROR: Failed to build gem native extension.

    current directory: /tmp/bundler20240322-47887-3hyqrfpsych-5.1.2/gems/psych-5.1.2/ext/psych
/usr/bin/ruby3.0 -I /usr/lib/ruby/vendor_ruby -r ./siteconf20240322-47887-mbz5v.rb extconf.rb
checking for yaml.h... no
yaml.h not found
*** extconf.rb failed ***
Could not create Makefile due to some reason, probably lack of necessary
libraries and/or headers.  Check the mkmf.log file for more details.  You may
need configuration options.

Solutions is:

sudo apt-get install -y libyaml-dev

Creating a NPM CLI application

Kuldeep Singh — Sun, 26 Nov 2023 00:00:00 +0000

I am writing this blog post today, following a long day, based on my writing mood. You will discover today how to build a npm CLI application.

I'm thinking of developing a cli package that uses npm to make a choice for you. Making decisions is something I struggle with in my personal life. So i am going to make a CLI tool to let JavaScript make decision from me. while writing this blog post i am learning think myself.

I have created my first npm CLI application, and you can check it out. Just run npx make-me-a-choice in your terminal.

Requirement

Must know what is NPM and how to use it little bit.
You need to have basic knowledge of JavaScript & Node.js.
Have a working computer that is able to run Node.js.
internet connection is must.

Creating project

Create a empty folder and give it the name according to project for me it is to make-me-a-choice.
Now open project folder in terminal & run npm init fill all the details.
Edit your package.json file add "bin" option like below.

{
...
"bin":{
    "<yourcommandname>":"bin/index.js" // use own command instead 
},
...
}

Create a file in bin\index.js it is going to be your & put below code in it or modify it according to your need.

#! /usr/bin/env node
console.log("Hellow from my NPM Package")

That's it now just run npm i & npx <yourcommandname> for my case i have create a project. make-me-a-choice. So i have make-me-a-choice as <yourcommandname>.

You have successful create a package add to you Github repo and make it public to for other to see.

Publishing on NPM

Now to publish you package to npm you need to have account on npm, if not just create one email and password. Open your project directory in terminal and run npm adduser this will SignIn in to you account in npm. Then just run npm publish in terminal in you project.

Hurray You have successfully published your first package to npm🎉

Now just run npx <yourcommandname> or npx <yourprojectname> <yourcommandname>

If you get error because their is already a package with same as you project name. Use npm init --scope=@my-username & npm publish --access public.

Checkout out my repo as example for taking some inputs and doing think in cli: https://github.com/kuldeepdev407/make-me-a-choice

1 more think if you delete an npm package you can republish same package in after 24 hour only.

References

NPM docs:- https://docs.npmjs.com/creating-node-js-modules