19
submitted 2 months ago* (last edited 2 months ago) by andioop@programming.dev to c/learn_programming@programming.dev

I just spent an hour searching for how I could have gotten an

Uncaught TypeError: Cannot set properties of null

javascript. I checked the spelling of the element whose property I was trying to set and knew that element wasn't null because the spelling was the same in the code as in the HTML. I also knew my element was loading, so it wasn't that either.

Turns out no, the element was null. I was trying to set " NameHere" when the element's actual name was "NameHere".

Off by a single space. No wonder I thought the spelling was the same—because all the non-whitespace was identical. (No, the quotation marks slanting in the second NameHere and being totally vertical in the first NameHere wasn't a part of the error, I am typing them all vertical and either Lemmy or my instance is "correcting" them to slanted for the second NameHere. But that is also another tricky-to-spot text difference to watch out for!)

And what did not help is that everywhere I specifically typed things out, I had it correct with no extra spaces. Trying to set " NameHere" was the result of modifying a bunch of correct strings, remembering to account for a comma I put between them, but not remembering to account for the space I added after the comma. In short, I only ever got to see " NameHere" written out in the debugger (which is how I caught it after like 30 repeats of running with the debugger), because everywhere I had any strings written out in the code or the HTML it was always written "NameHere".

I figured I'd post about it here in case I can help anyone else going crazy over an error they did not expect and cannot figure out. Next time I get a similar error I will not just check spelling, I'll check everything in the name carefully, especially whitespace at the beginning and end, or things one space apart being written with two spaces instead. Anyone else have a similar story to save the rest of us some time?

you are viewing a single comment's thread
view the rest of the comments
[-] madeindjs@programming.dev 3 points 2 months ago

My top 3 (as mainly JS dev) would be:

  1. Number overflow. It happens when you're backend send big number ID serialized in a JSON. The solution is to wrap the number into a string when you know that can happens.
JSON.parse('{"n": 123456789123456789012.0}').n
// => 123456789123456800000
  1. Mutating an Object by ref (now I use Object.freeze a lot). Something like:
const CONFIGURATION = { conf: { enabled: false } }
// setup a "copy"
let currentConfiguration = { ...CONFIGURATION }
currentConfiguration.conf.enabled  = true
// try to reset the conf
currentConfiguration = { ...CONFIGURATION }
// => { conf: { enabled: true } }
  1. Assignation instead of comparison (now my IDE warn me)
if (foo = false) {
  // do something
}
this post was submitted on 20 Aug 2024
19 points (95.2% liked)

Learn Programming

1616 readers
1 users here now

Posting Etiquette

  1. Ask the main part of your question in the title. This should be concise but informative.

  2. Provide everything up front. Don't make people fish for more details in the comments. Provide background information and examples.

  3. Be present for follow up questions. Don't ask for help and run away. Stick around to answer questions and provide more details.

  4. Ask about the problem you're trying to solve. Don't focus too much on debugging your exact solution, as you may be going down the wrong path. Include as much information as you can about what you ultimately are trying to achieve. See more on this here: https://xyproblem.info/

Icon base by Delapouite under CC BY 3.0 with modifications to add a gradient

founded 1 year ago
MODERATORS