CODEWITHSUNDEEP
javascriptgoogle-chromegoogle-chrome-devtools
delphirules
delphirules

Reputation: 7390

Chrome Devtools console not working in certain websites

I'm doing some studies in Javascript using Twitter website as example. In any website i can open Google Devtools and use the console to manipulate anything on the page, such as get DOM nodes, edit elements and so on.

For instance, when i open 'www.google.com', go to Devtools and type the command above :

console.log('testing');

I get 'testing' string showing in the console.

enter image description here

However, when i open 'www.twitter.com' and do the same thing, NOTHING happens. Nothing is shown in console, just an 'undefined' string as shown below :

enter image description here

Why this behaviour happens only on Twitter website ?

EDIT : Tried the solution proposed on "delete" - restore native function not working for changed prototype, how then?

But did not work :

enter image description here

Upvotes: 3

Views: 3207

Answers (2)

Fabio Antunes
Fabio Antunes

Reputation: 22862

In Javascript you can modify your global objects, so it's possible for you to do something like

Array.prototype.push = function(element) {
  this[this.length] = 'blah'
}

Now every time you add a element to any array it will always add 'blah';

const myArray = [];
myArray.push(1);
myArray.push(2);
myArray.push(3);
console.log(myArray);
// output ['blah', 'blah', 'blah']

In the twitter website they did the same, although the code is minified you can see it here:

, Y = ["log", "warn", "debug", "info"]
, K = function() {}
, Q = ""

Line 1414 file https://abs.twimg.com/k/en/init.en.caa653749241467e7dbb.js

To make it work again, copy each line and run it on your console (credits for this solution to Rob W):

var frame = document.createElement('iframe');
document.body.appendChild(frame);
console = frame.contentWindow.console
console.log('it works')

Upvotes: 8

Evan Knowles
Evan Knowles

Reputation: 7501

If you type in just console.log (without any brackets), you can list the code for the log function on that website. Doing this on Twitter gives you

function (){}

Which is indeed an empty function showing that they've overwritten the default. By contrast, the same on google.com gives

function log() { [native code] }

Which is the default.

Upvotes: 2

Related Questions