Problem with google chrome devtools Elements/Properties - google-chrome

Hi I have a problem with google chrome devtools: Elements/Properties.
When i selected an element in properties window it showed element + selectors. Now it shows this weird code. I also tried to restart all the settings, but the problem doesn't go away.

Related

How do I enable icon setting in Chrome browser?

How do I enable this inspect element in Google Chrome? The part that is enclosed in red box.
Because right now, by default, this is what I see with my inspect element.
Do I need to install something or this is within settings?
Your screenshots are from different browser dev tools. If m not wrong, the top one is on Firefox where the bottom one is Chrome.
The Inspector tab is similar to the Elements tab in Chrome
The Debugger tab is similar to the Sources tab in Chrome

Why can't I inspect elements in cypress.io

Why can't I inspect elements in cypress.io window?
I have installed cypress 3.1.0 and when I run a test I can see it open in the chrome window. I run the same code at work and in my window at work, I can right click and Inspect Element, for some reason I can't do the same thing at home. Odd indeed.
In Cypress it says I am running Running Electron 59.I totally can inspect in a normal chrome window. My chrome version is browser Version 70.0.3538.77 (Official Build) (64-bit). Am I missing something here?
* update, at work I found out I am using 3.0.2
* update, I also notice at home, I get a 2nd icon in the window bar for cypress at home, at work I get a 2nd chrome window icon in the window bar
Inspector is indeed hidden. Ctrl + Shift + D ( Cmd + Shift + D) will move its position to a visible area.
I'm having the same issue opening the inspector whether via shortcut or "click > Inspect" (Chrome 69, OSX 10.11.6, Cypress 3.1.0)
What is happening is that the dev tools are opened with a size of about 1x10 pixels on my top left corner, and I have to hide other windows in order to see the tools and be able to resize them.
Chances are that the Inspector is opened but hidden somewhere.
Hope that this helps

Chrome Mobile Render tool not rendering dropdowns

When I open Developer tools and turn on device mode, and click any drop down on the page chrome renders options with minimum width and rest of the area as black.
I dont know what is causing this error. I tried to update my graphics card driver, but problem still exists.
After some googling, got to know that this is an issue in Chrome browser itself. Refer the following link for more info - https://bugs.chromium.org/p/chromium/issues/detail?id=553274&q=status%3Aunconfirmed&sort=-id&colspec=ID%20Pri%20M%20Iteration%20ReleaseBlock%20Cr%20Status%20Owner%20Summary%20OS%20Modified&num=1000

Developer Tools in Chrome Canary not displaying properly

When I bring up the dev tools in Chrome Canary, it just appears as a black box. I have it set to display in another window rather than overlaying the actual page, but as said, the inside of this window is just black. If I hover the mouse over it, it highlights the elements on the page accordingly.
I have tried: Looking for settings to dock it back into the screen, restarting CC, restarting my computer, reverting to default settings in the CC menu. None of this has changed a thing unfortunately.
EDIT: Has been resolved with update to version 33.0.1707.0
Same thing happened to me, starting sometime in the past two days. I tried everything you did and also tried reinstalling Chrome Canary, no dice. My solution was to dock the developer tools back to the main browser window by clicking in the upper-right corner of the black box, where I think the dock icon usually is.

Empty area appears at the bottom of page on chrome

I have problem on my website. If I open my website with HTTPS protocol, chrome shows an empty area at the bottom of page.
You can reproduce this if follows this steps:
Open new separate incognito tab using the lastest chrome version on windows
Go to this page. It will show a message that certificate is invalid. Ignore it.
At the bottom of page should appear unused area.
Why chrome shows this empty area on my page? It will disappear if I resize window. I also tried to disable all plugins, but it didn't help.
Depending on which version of Chrome that you are using, there is a reported issue of this grey area displaying only when the "Show bookmarks" (ctrl-shift B) is selected. Here is a link to the bug report: https://code.google.com/p/chromium/issues/detail?id=139765
The issue purports to be fixed in the current version of Chrome.