Open Developer Tools and click the &quot;phone&quot; icon - upper left corner.  This toggles the ruler on and off.

[![Toggle device toolbar screenshot][1]][1]


  [1]: https://i.stack.imgur.com/fHuJO.png

You can also use the keyboard shortcut: 
Windows: Ctrl + Shift + M 
Mac: Cmd + Shift + M

Let me preface this by saying I am a novice to ReactJS. I am trying to learn by making a simple site that populates data using React. I have a JSON file that contains link data that will be looped through with map. 

I have tried setting it as the components state then passing it to the navbar links via a prop but I am getting &quot;Uncaught TypeError: Cannot read property &#39;data&#39; of null&quot;

I tried to look around for solutions but could not find anything.


Note: When I try to hard code an object and map through it that way it returns map is undefined. However I am not sure that is directly related to the setState error.

    /** @jsx React.DOM */
    
    var conf = {
        companyName: &quot;Slant Hosting&quot;
      };
    
    var NavbarLinks = React.createClass({
      render: function(){
        var navLinks = this.props.data.map(function(link){
          return(
            &lt;li&gt;&lt;a href={link.target}&gt;{link.text}&lt;/a&gt;&lt;/li&gt;
          );
        });
        return(
          &lt;ul className=&quot;nav navbar-nav&quot;&gt;
            {navLinks}
          &lt;/ul&gt;
        )
      }
    });
    
    var NavbarBrand = React.createClass({
      render: function(){
        return(
          &lt;a className=&quot;navbar-brand&quot; href=&quot;#&quot;&gt;{conf.companyName}&lt;/a&gt;
        );
      }
    });
    
    var Navbar = React.createClass({
      getInitalState: function(){
        return{
          data : []
        };
      },
      loadNavbarJSON: function() {
        $.ajax({
          url: &quot;app/js/configs/navbar.json&quot;,
          dataType: &#39;json&#39;,
          success: function(data) {
            this.setState({
              data: data
            });
            console.log(data);
            console.log(this.state.data);
          }.bind(this),
          error: function(xhr, status, err) {
            console.error(this.props.url, status, err.toString());
          }.bind(this)
        });
      },
      componentDidMount: function(){
        this.loadNavbarJSON();
      },
      render: function(){
        return(
          &lt;nav className=&quot;navbar navbar-default navbar-fixed-top&quot; role=&quot;navigation&quot;&gt;
            &lt;div className=&quot;container-fluid&quot;&gt;
              &lt;div className=&quot;navbar-header&quot;&gt;
                &lt;NavbarBrand /&gt;
              &lt;/div&gt;
              &lt;NavbarLinks data={this.state.data} /&gt;
            &lt;/div&gt;
          &lt;/nav&gt;
        );
      }
    });
    
    var Header = React.createClass({
      render: function(){
        return(
          &lt;Navbar /&gt;
        );
      }
    });
    
    React.renderComponent(
      &lt;Header /&gt;,
      document.getElementById(&#39;render&#39;)
    );


ReactJS this.state null

So I have a **`n x d`** matrix and an **`n x 1`** vector. I&#39;m trying to write a code to subtract every row in the matrix by the vector.

I currently have a **`for`** loop that iterates through and subtracts the **`i`**-th row in the matrix by the vector. **Is there a way to simply subtract an entire matrix by the vector?** 

Thanks!

Current code:

    for i in xrange( len( X1 ) ):
        X[i,:] = X1[i,:] - X2

This is where **`X1`** is the matrix&#39;s **`i`**-th row and **`X2`** is vector. Can I make it so that I don&#39;t need a **`for`** loop?


numpy subtract every row of matrix by vector

Since recent updates, Chrome DevTools now shows a useful device emulator:

![enter image description here][1]

Which is great, but **I&#39;m not emulating anything:**

 - All the options in Device are unticked
 - All the options in Media are unticked
 - All the options in Network are unselected
 - All the options in Sensors are unticked

Clicking the &#39;reset&#39; button also still shows the emulation bar.

**How can I turn  Chrome DevTools device emulator off when I am not using it?**

  [1]: http://i.stack.imgur.com/Yl2ot.png

I am not emulating mobile devices. How do I disable the Chrome DevTools device emulator?

Since recent updates, Chrome DevTools now shows a useful device emulator:
<img src="http://i.stack.imgur.com/Yl2ot.png" alt="enter image description here">
Which is great, but I'm not emulating anything:
<ul>
<li>All the options in Device are unticked</li>
<li>All the options in Media are unticked</li>
<li>All the options in Network are unselected</li>
<li>All the options in Sensors are unticked</li>
</ul>
Clicking the 'reset' button also still shows the emulation bar.
How can I turn Chrome DevTools device emulator off when I am not using it?

I&#39;m debugging an application which uses React.js, the Chrome Extensions list clearly shows that the React Developer Tools are installed, and when i access the React site at http://facebook.github.io/react/ i can clearly see a &quot;React&quot; tab in the developer tools window. Yet when i&#39;m debugging my application i see this in the console:

`Download the React DevTools for a better development experience: http://fb.me/react-devtools React.js:87`

Can someone tell me how to get it to use the React Developer Tools?

thanks!

react dev tools not loading in Chrome browser

As far as I can tell, this error was not being thrown yesterday on Chrome, and as of this morning, it is. I have not changed any of my browser settings. I have attached a screenshot (after opening/closing Developer Tools window four times):

![Failed to load resource: net::ERR_CACHE_MISS][1]

This issue is tangentially similar to Stack Overlow post *[Failed to load resource under Chrome][2]* except that it only occurs when I &quot;Inspect Element&quot; in Chrome. Here are the details I have:

To the best of my ability I undid everything I did since last night (when I did not have this error) and the error persists. When I remove all pre-`&lt;html&gt;` [PHP][3] code, the error disappears.

When I only remove all the pre-`&lt;html&gt;` PHP code except 

    &lt;?php session_start(); ?&gt;

the error returns.

Since the error seems to involve PHP, I checked my error log, but there are no notices, warnings, nor errors. When I close the Developer Tools window and then open up the window without a page reload, the number of errors increments by one each time.

When I keep the window open, and then reload the page, the page reloads without throwing the error. However, as soon as I close the Developer tools window again, then open it (no page reload), the error is thrown. I checked my site on Firefox with [Firebug][4] enabled, and no errors are thrown, making it seem like a Chrome issue (version 38). My site seems to function normally otherwise. Other sites on device browsed via Chrome (for example, Yahoo) also experience this error.

Also, I have not manually changed any of my browser settings since months ago. As an additional note, this is the **second strange error I have encountered in Chrome** in the last year (see Stack Overflow question *[Failed to load resource: net::ERR_NETWORK_IO_SUSPENDED][5]*), to which no one was able to find a solution, even with a bounty offered.

Is there a way to prevent this error, or is this a browser-only issue? On a side note, when I open up Developer Tools in Chrome for Stack&amp;nbsp;Overflow, there is no error thrown, so either Stack&amp;nbsp;Overflow is not coded in PHP or they have a way to prevent this error. I think my site is not affected, but I am not 100% sure, and it makes me nervous :)

  [1]: http://i.stack.imgur.com/PF8gF.png
  [2]: https://stackoverflow.com/questions/4390134
  [3]: http://en.wikipedia.org/wiki/PHP
  [4]: http://en.wikipedia.org/wiki/Firebug_%28software%29
  [5]: https://stackoverflow.com/questions/23725085


Bizarre Error in Chrome Developer Console - Failed to load resource: net::ERR_CACHE_MISS

Does anybody know what the following Chrome error is?

    Failed to load resource: net::ERR_CACHE_MISS

I have had a look online, but have not found a good answer yet. Somebody said it might be related to the latest Chrome update?

What is it and how can I resolve the issue?

Cheers

Chrome - ERR_CACHE_MISS

I am using ASP.NET Web API: http://xyzdomain.com:16845/api/returns/returns

How do I send a POST request to the endpoint using Postman Chrome extension, given `Items` is a collection:

    [
      {
        &quot;Items&quot;: [
          {
            &quot;sku&quot;: &quot;9257&quot;,
            &quot;Price&quot;: &quot;100&quot;,
            &quot;Quantity&quot;: &quot;500&quot;,
            &quot;DiscountPercent&quot;: &quot;1&quot;,
            &quot;backordered&quot;: &quot;2&quot;
          }
        ],
        &quot;order_id&quot;: &quot;F429768865001&quot;,
        &quot;status_code&quot;: &quot;Shelf&quot;,
        &quot;Exception&quot;: &quot;no error&quot;
      }
    ]

Postman: sending nested JSON object

For some reason device emulation mode is not reading my media queries. It works on other sites including my own sites that I made with bootstrap, but it&#39;s not working on media queries I am using from scratch (clicking the media queries button turns the button blue but no media queries are displayed). Test file below. Is this a bug in Chrome or is there something I need to change in my file?


    &lt;!DOCTYPE html&gt;
    &lt;!--
	Media Queries Example 1
	Sam Scott, Fall 2014
    --&gt;
    &lt;html&gt;
	&lt;head&gt;
		&lt;title&gt;MQ Example 1&lt;/title&gt;
		&lt;meta charset=&quot;UTF-8&quot;&gt;
        &lt;meta name=&quot;viewport&quot; content=&quot;width=device-width, initial-scale=1&quot;&gt;
		&lt;style&gt;
			body { font-family: sans-serif; }
			h1 { color: red; } 
			h2 { color:blue; }
			p { color:green; }
			
			@media (max-width: 768px) and (min-width: 481px) {
				h1 { color: green; } 
				h2 { color:red; }
				p { color:blue; }
			}
			
			@media (max-width:479px), print { 
				h1,h2,p { color:black; }
			}
			
			@media print {
				body { font-family: serif; }
			}
			

		&lt;/style&gt;
	&lt;/head&gt;
	&lt;body&gt;
		&lt;h1&gt;I&#39;m a first level heading&lt;/h1&gt;
		&lt;p&gt;I&#39;m a paragraph.&lt;/p&gt;
		&lt;h2&gt;I&#39;m a second level heading&lt;/h2&gt;
		&lt;p&gt;I&#39;m another paragraph.&lt;/p&gt;
	&lt;/body&gt;
    &lt;/html&gt;

Chrome Device Mode Emulation Media Queries Not Working

Starting a couple of weeks ago....on some of our sites, but not all, when inspecting an element, the styles tab only shows the &quot;styles box&quot;, but not the actual styles relating to css?? - Again, this is **ONLY** on some sites - weird

**It should look like this** (with styles showing on the right relating to css)

![correct styles tab][1]


**BUT**......instead, on **SOME** of our sites, this just started a couple of weeks ago looking like this....with no css showing in the styles tab:

![incorrect styles tab][2]

**NOTE: it has worked for 2 years - The page looks fine and all styles are being applied to the DOM, but do NOT show up in the styles tab when inspecting element.**

Any ideas??

  [1]: http://i.stack.imgur.com/K6JIA.png
  [2]: http://i.stack.imgur.com/q5k3U.png

Google Chrome Dev Tools inspect element styles not showing

I&#39;m trying to implement long polling for the first time, and I&#39;m using XMLHttpRequest objects to do it. So far, I&#39;ve been successful at getting events in Firefox and Internet Explorer 11, but Chrome strangely is the odd one out this time.

I can load one page and it runs just fine. It makes the request right away and starts processing and displaying events. If I open the page in a second tab, one of the pages starts seeing delays in receiving events. In the dev tools window, I see multiple requests with this kind of timing:

  ![screenshot](http://i.stack.imgur.com/qFDtX.png)

&quot;Stalled&quot; will range up to 20 seconds. It won&#39;t happen on every request, but will usually happen on several requests in a row, and in one tab.

At first I thought this was an issue with my server, but then I opened two IE tabs and two Firefox tabs, and they all connect and receive the same events without stalling. Only Chrome is having this kind of trouble.

I figure this is likely an issue with the way in which I&#39;m making or serving up the request. For reference, the request headers look like this:

    Connection: keep-alive
    Last-Event-Id: 530
    User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/39.0.2171.71 Safari/537.36
    Accept: */*
    DNT: 1
    Accept-Encoding: gzip, deflate, sdch
    Accept-Language: en-US,en;q=0.8

The response looks like this:

    HTTP/1.1 200 OK
    Cache-Control: no-cache
    Transfer-Encoding: chunked
    Content-Type: text/event-stream
    Expires: Tue, 16 Dec 2014 21:00:40 GMT
    Server: Microsoft-HTTPAPI/2.0
    Date: Tue, 16 Dec 2014 21:00:40 GMT
    Connection: close

In spite of the headers involved, I&#39;m not using the browser&#39;s native EventSource, but rather a polyfill that lets me set additional headers. The polyfill is using XMLHttpRequest under the covers, but it seems to me that no matter how the request is being made, it shouldn&#39;t stall for 20 seconds.

What might be causing Chrome to stall like this?

**Edit:** Chrome&#39;s chrome://net-internals/#events page shows that there&#39;s a timeout error involved:

    t=33627 [st=    5]      HTTP_CACHE_ADD_TO_ENTRY  [dt=20001]
                    --&gt; net_error = -409 (ERR_CACHE_LOCK_TIMEOUT)

The error message refers to a patch added to Chrome six months ago (https://codereview.chromium.org/345643003), which implements a 20-second timeout when the same resource is requested multiple times. In fact, one of the bugs the patch tries to fix ([bug number 46104](https://code.google.com/p/chromium/issues/detail?id=46104)) refers to a similar situation, and the patch is meant to *reduce* the time spent waiting.

It&#39;s possible the answer (or workaround) here is just to make the requests look different, although perhaps Chrome could respect the &quot;no-cache&quot; header I&#39;m setting.



Chrome stalls when making multiple requests to same resource?

I am currently analysing my page connections and I want to block some tracking scripts and other external URL calls in my network monitor inside Chrome&#39;s developer tools.

I quickly want to check how the page behaves without some libraries. 

Chrome itself does not provide any functions like this and the famous blocking extensions only block URLs which the user enters manually into the navigation bar.

How to block a URL in Chrome&#39;s developer tools network monitor

Chrome console shows me &quot;Navigated to http://localhost....&quot; in blue letters 

Image: 
![enter image description here][1]


  [1]: http://i.stack.imgur.com/gnYnA.jpg

Content Type	Original Author	Original Content on Stackoverflow
Question	mikemaccana	View Question on Stackoverflow
Solution 1 - Google Chrome	Havel	View Answer on Stackoverflow
Solution 2 - Google Chrome	jaredwilli	View Answer on Stackoverflow

I am not emulating mobile devices. How do I disable the Chrome DevTools device emulator?

Google Chrome Problem Overview

Google Chrome Solutions

Solution 1 - Google Chrome

Solution 2 - Google Chrome

numpy subtract every row of matrix by vector

ReactJS this.state null

Attributions