I have an image tag
<img src="https://biossantibodies.com/image-raw/4449.jpeg">
Where it displays properly in Chrome/Firefox/Safari, but not IE.
Result
Fiddle link: https://jsfiddle.net/bheng/6z3u7dxm/
Chrome
IE
Console Error
Network Tab Result
How can I debug this?
set up the IE debugger to record console messages for blocked and insecure content... Tools>Internet Options>Advanced tab, check "Always record developer console messages". Save changes... now when you open the dev tool it will list any (otherwise) suppressed markup and blocked content warnings and messages.....
While you are configuring Internet OPtions above, also make sure that your IE security zone settings are restored to the factory/company defaults... Security tab of Internet Options, click "Reset all zones to default". Settings for Multimedia and images ( elements) can be found on the Advanced tab of Internet Options Multimedia section and in the Security section on the Advanced tab of Internet Options, re: "Block unsecured images with other mixed content"
To find out which IE security zone a domain is mapped to, when visiting the domain, select the File>Properties menu from IE.... it lists the IE security zone that the domain is mapped to.... If you have placed the domain in your Trusted, Intranet or Restricted sites list, remove it.... other browsers do not use the IE Security zone model (security by per site)... publicly accessible sites are/should be designed to work in web browsers to work in the browsers' default security zone/settings.
You should also note the site specific settings for ActiveX filtering and Tracking Protection... you can turn those features on/off from the Tools menu in IE.
To list the request and responses on the Networking tab, pin the dev tool to your browser tab, then click the Start button on the networking tab, and the button (looks like a floppy disk) to "Always refresh from server"..... without closing the dev tool.
It is important that when debugging scripts on web pages that 1. you have configured the debug tab to "Break on all exceptions".... on the debug tab, select "Break on all exceptions" from the dropdown (looks like a Stop sign). 2. The dev tool MUST be open while you are debugging, so pin it to the bottom of the tab you are debugging.
Related
These are the approaches I have tried:
View HTTP headers in Safari 10, but the cookies is not showed there
I can find Cookies section under Storage Tab, but the Cookies are displayed in a table.
I would like to view the Cookies in a string rather than a table, is there any way except using another browser?
Go to the Console* tab. Type
document.cookie
which shows all cookies for this location.
*: to access the console, (credit #Geoff Crompton)
if [you] have the developer menu enabled, [you] can go to the Develop menu, choose Show Web Inspector, and in the bottom of the new window type document.cookie to see the cookies for the current website
Safari Version 14.0.3 (16610.4.3.1.4)
The Develop menu of Safari adds a variety of additional features to the web browser on the Mac, including the inspector and error consoles, javascript debugging tools, the ability to disable various page elements, enable the Do Not Track feature, use WebGL acceleration, and it offers a simple way to change the browsers user agent.
Develop menu in Safari:
Pull down the Safari menu and choose Preferences
Click on the Advanced tab
Check the box next to Show Develop menu in menu bar
Close Preferences, the Develop menu will now be visible between Bookmarks and Window menus
It will require a little fiddling, but there is a Python script here http://www.securitylearn.net/2012/10/27/cookies-binarycookies-reader/ that can dump the Binary Cookie format (located in ~/Library/Cookies/).
When using Safari Web Inspector to view the Network Log, the log is reset upon navigation, i.e. navigating to a different page clears the log.
In the Chrome Developer Tools, I can easily persist the network log by checking the "Preserve log" checkbox in the Network tab. In Firefox Developer Tools, I can preserve the network log by checking "Enable persistent logs" in the developer tools preferences.
With this persistence enabled, the network log remains intact until I manually clear the output, simplifying the process of tracking requests and redirects that happen during navigation to a new page.
Is there a similar feature in Safari Web Inspector?
In Safari 16.0 they have moved again:
In Safari 11.1.2 this is a setting on each tab under the checkbox "Preserve Log"
Note that if your Web Inspector window is too narrow to show all options, you'll have to expand it until it is wide enough to display the Preserve Log option, as mentioned in an answer by ShortFuse.
In Safari 11 this was in the Settings panel under "Network: Clear when page navigates", and it's sister setting "Console: Clear when page navigates".
There is a Preserve Log option in Network.
The problem is that if your window is too narrow, it disappears and Safari gives you no indication that it's there. Resize your Web Inspector window to be wider.
(That was a fun one to figure out!)
This was just added to WebKit last week: https://trac.webkit.org/changeset/211451
You can expect it to make it into a Safari Technology Preview build soon. Once it's in a build, you can toggle preserving logs on navigation in the Settings Tab.
It is the logo with a circle and 3 horizontal lines that preserves network tab -> preserve logs button, at least in Version 16.0
I am doing some testing of firefox and got myself into situation where I need some cookies to be present while some others to be removed. I could write javascript that would do this, but was wondering if there is a way to do it via UI, like it can be done on Chrome dev tools.
You can do this with a raw firefox:
First click on the small earth/lock logo at the left of the address:
Then click on "More informations"
In the popup, click "See the cookies"
In the second pop-up, you can selected and delete any cookie.
How do I remove specific cookies on firefox
You can do this with the Web Developer extension, which adds various web developer tools to the browser.
Right click on page
Select Web Developer
Select `Cookies
Select View Cookie Information
The resulting tab/window has options to Delete and Edit the cookies for the current web page.
I think it is used to check the coding but when I tried it didn't respond. I mean it doesn't give any response and showing the data of current website.
F12 opens the built in Firefox Developer Tools in recent versions of Firefox. Press F12 again to close it. There is an extension to turn off the shortcut: https://addons.mozilla.org/en-US/firefox/addon/disable-f12-shortcut/
The f12 is a shortcut to Open up firebug in firefox. To open up firebug you must firstly have it installed
F12 is a standard Firefox shortcut that toggles the 'Firefox Developer Tools' on and off.
When you hit F12, Firefox's bottom half opens to show/reveal it's 'Developer Tools,' a Web Console (toolbox?), which
Logs information associated with a web page: network requests, JavaScript, CSS, security errors and warnings as well as error, warning and informational messages logged by JavaScript code running in the page.
Enables you to interact with a web page by executing JavaScript expressions in the context of the page.
It also has an inspector, a debugger, style editor, a profiler and more.
Again, F12 toggles it on and off.
Go to ≡ > Web Developer and you can see the menu of all it does and their shortcuts.
(Firebug was a free open-source web extension for Firefox that facilitated the live debugging, editing, and monitoring of any website's CSS, HTML, DOM, XHR, and JavaScript.
It was deprecated (replaced by something better) in favor of the integrated developer tools (F12) added to Firefox itself. As Firefox 57 no longer supports XUL add-ons, Firebug is no longer compatible.)
F12 is not bound to anything in Firefox - see Keyboard shortcuts. You are probably thinking of the Firebug addon which opens with that key.
The built-in Page Inspector in Firefox (v10 onwards) is accessed with Ctrl+Shift+I and then Alt+M.
In newer versions of Firefox (I have 91.12.0esr), there is an
"experimental" setting in the about:config configuration page that can disable the F12 hotkey (https://bugzilla.mozilla.org/show_bug.cgi?id=1630228)
Setting the devtools.experiment.f12.shortcut_disabled key to true causes the F12 key to bring up a temporary text box that says "To use the F12 shortcut, first open DevTools via the Web Developer menu." but thankfully no longer opens the DevTools bar.
This should be the default behavior, IMHO, since only a small fraction of users will know or care about viewing the HTML source of the page.
I have recently introduced some Google +1 buttons to my site.
I am calling the button like this:
<g:plusone size="small"
count="false"
callback="plusone_vote"
href='http://www.mysite.com'>
</g:plusone>
The plusone_vote callback is a js function which pushes a tracking event to Google Analytics.
This works for the majority of users. However, a small number are getting an issue. When they click on the +1 link a new IE window appears and then displays the message
"The webpage you're viewing is trying to close this window.
Do you want to close this window?"
If the user clicks "No" they get they Google +1 privacy page ("I'm fine with Google using my +1's and other info around content and ads on non-Google websites"). They can then click the "Share my +1's button" and the window closes. However, they "+1" action never appears to happen. The button does not turn blue and the page does not show up in their profile.
The users were all using IE8 or IE9 on Windows 7 - a combination which works fine for most users. The only thing that appears to be the same is that they all use the same type of laptop - I'm struggling to see the significance of that though.
Any ideas?
The actual issue is with your IE security settings: the page MUST be displayed as a regular 'internet' webpage in order for IE to correctly run the +1 and Facebook Like plugins without this error message.
In order to fix this:
Go into Internet Options in the IE menu
Go to Security Settings. Click on 'local intranet'.
Click on sites. Make sure 'detect local intranet' and all it's sub checkboxes are unchecked. Go into 'advanced' and make sure your webpage's domain is not listed. Close this window.
Now, click on 'Trusted Sites' and then 'Sites'. Make sure to remove your site's domain if it's listed.
All sites which are not 'Intranet' or a 'Trusted Site' default to public internet settings, which is the same as what your users will see (unless you're writing a business application which runs for internal network users, I suppose). This should fix this pop up, and allow +1 and Facebook like plugins to function correctly.