I'm developing on Angular 12 + Material for the front-end part of a full-stack project and I'm before an apparently Javascript/ES/Node/Angular bug which is driving me absolutely crazy because it has no sense at all.
I have an object called "data" one of whose properties could be and usually are empty strings for they are hidable sections of a blog page.
let data = {
titulo: cbidioma.titulo,
subtitulo: cbidioma.subtitulo,
contenido: "",
contenido2: cbidioma.contenido2,
contenido3: cbidioma.contenido3,
contenido4: cbidioma.contenido4,
blockquote: cbidioma.blockquote,
fid_idioma: cbidioma.fid_idioma,
fid_entradablog: this.entradaBlog.entradaBlog_id,
};
console.log("DATA",data);
More precisely, the property called "contenido" or "content" is the one that made me realize, but it's also happening with any other property or javascript object which I could declare in my app components.
As logic says, "contenido" property should remain an empty string when prompting it at the console. However, it is unexplainably replaced by an undefined value that, in a even odder way, only shows up when expanding the object definition at the console.
Let me explain with an image
Paranormal object transformation
This bug or whatever is driving me and my team somehow a little bit mad and we're in desperate need of somebody who only can explain what is happening here.
Thank you in advance for reading :3
UPDATE: Despite how much as I thought I had checked it, I eventually found a piece of asynchronous code being executed onto the object and, how not, making a somehow wrongly planned sanitizing object[key] = !object[key] ? undefined : object[key];
Thank you everyone for your answers, both published up to now were just in the right spot of the answer :)