Same Javascript code but not same act - javascript

//Edit
Hello.
I have made a website and uploaded to the host. So, the codes what are in my localhost and in the website host are same. Everything works except one JavaScript(jQuery) action(A dropdown menu). On my localhost it works perfect, on the website host, it drops and rises again and than doesn't drop again.
site : http://www.hastahakki.com/index.php?page=anasayfa
The problem on the big buttons like "Doğru Hastane Seçimi" , "Hasta Şikayetleri"
How do I do?

It's rare for pure client code to work differently in a hosted environment provided it is uploaded properly and the same browser is used.
First I would check it's not a cache issue by clearing my browser cache.
Then I would view it in a browser with modern developer tools, which is most browsers with the latest version (Firefox requires the excellent Firebug plugin). In Chrome for instance, looking at the Network output will show you if any resources are failing to load, and the Scripts view will show you any local JavaScript errors that might be triggered by the hosted version.

Related

JS - Programmatically open DevTools [duplicate]

I'm looking for a way to open the WebKit “developer tools” from a script attached to a web-page. I need solutions for both Google Chrome and Safari, that will open the developer-tools pane if it's not already open, and (hopefully, if you can figure out how) also switch to a particular tab/section of said pane upon opening.
(Use-case, if anyone's interested: I want to open the console.log output-window if there's been an error and a developer is looking at the page; this particular page will be the output of some JavaScript unit-tests.)
I'm setting a bounty on this question because it's obviously one that hasn't been answered to anyone's satisfaction before, and the answer is a hairy one. Please don't answer it unless you have a real answer that both: 1) works in both browsers, and 2) doesn't require private extension APIs that won't work from a static web-page.
See (related, but specific to Chrome, and extensions): Can I programmatically open the devtools from a Google Chrome extension?
Simply: You can't.
The Dev Tools are not sandboxed (unlike any web page), thus granting sandboxed environments the power to open and control an unsandboxed environment is a major security design flaw.
I hope this answers your question :-)
You cannot directly use the Chrome's Dev Tools from your web pages. It is bundled with the browser.
But you can use it like a regular web application. Go to Chrome Developer Tools, then go to Contributing. You will find help on using Dev Tools for your app.
Setting up
Install Chrome Canary on Mac OS / Windows or download the latest Chromium build from the Chromium continuous builds archive on Linux
Clone Blink git repo from https://chromium.googlesource.com/chromium/blink.git
Set up a local web server that would serve files from WebKit/Source/WebCore/inspector on some port (8090)
Running
Run one copy of Chrome Canary with the following command line flags: --remote-debugging-port=9222 --user-data-dir=blink/chromeServerProfile --remote-debugging-frontend="http://localhost:8090/front_end/inspector.html". These flags cause Chrome to allow websocket connections into localhost:9222 and to serve the front-end UI from your local git repo. (Adjust the path to chromeServerProfile to be some writable directory in your system).
Open a sample page (eg www.chromium.org).
Run a second copy of Chrome Canary with the command line flag: --user-data-dir=/work/chromeClientProfile. Open http://localhost:9222. Among the thumbnails you will see the sample page from the other browser instance. Click on it to start remote debugging your sample page.
The DevTools web page that opens is served from the remote-debugging-frontend in the first browser instance, which serves from the git repo your local filesystem. Debug this Devtools Web page and edit its source like any other web app.
I hope this is what you need.
There's no way to control the web developer tool from an in-page script, other than through the Console API which provides mostly logging facilities. Letting scripts control more than that would be a serious security issue, since it would allow a web page to control parts of the browser.
The only API remotely related to what you're trying to do is the debugger command, which switches to the script pane only if the developer tools were already open.
But who are you trying to develop this feature for?
If it's for developers working on the site, then it's better to just use the existing developer tools manually, by setting breakpoints, or the pause on exceptions toggle.
If it's for end users, don't. Unless your site is supposed to be used by highly technical web developers, you're only going to scare away users if the developer tools suddenly pop up with errors.
If you really want to show errors you can implement your own logging framework and the UI for error reporting, which works with basic JS and doesn't depend on a specific browser environment.
here's another answer that proposes a solution to your mentioned use case/objective (detecting errors, getting & displaying console logs) and not the not possible objective in the title.
you can make and use a console wrapper and use it in your code
and/or you can monkey patch the console functions if you use/import external js, but you need to apply it before loading them.
No, Any secure Browser will not allow a script to open an extension, as it leads to insecurity.
But, You may design an Add-On/extension OR Console API's to do the same.. for specific site.
Create an Add-On like this to achieve that requirement.
You can try sending keys 'CTRL' + SHIFT' + 'I'
that may work for Chrome any FireFox (in I.E you need to use 'F12'
I am using it when required as few utils in this add-on use to work better then the built-in.
EDIT:
Now a days Chrome is advanced with many new advancements source.
I hope this helps!
Hate to answer such an old question, but was surprised to not see this as an answer, so I thought I'd add it in case it can help someone in the future.
Assuming you have access to the source code, you can place an alert("open devtools"); statement immediately before the first line you're interested in debugging. This alert will give you an opportunity to open DevTools and set a breakpoint on that first line before clearing the alert thus allowing the code to continue and hitting the breakpoint.

Open Safari / Google Chrome developer tools programmatically from JavaScript

I'm looking for a way to open the WebKit “developer tools” from a script attached to a web-page. I need solutions for both Google Chrome and Safari, that will open the developer-tools pane if it's not already open, and (hopefully, if you can figure out how) also switch to a particular tab/section of said pane upon opening.
(Use-case, if anyone's interested: I want to open the console.log output-window if there's been an error and a developer is looking at the page; this particular page will be the output of some JavaScript unit-tests.)
I'm setting a bounty on this question because it's obviously one that hasn't been answered to anyone's satisfaction before, and the answer is a hairy one. Please don't answer it unless you have a real answer that both: 1) works in both browsers, and 2) doesn't require private extension APIs that won't work from a static web-page.
See (related, but specific to Chrome, and extensions): Can I programmatically open the devtools from a Google Chrome extension?
Simply: You can't.
The Dev Tools are not sandboxed (unlike any web page), thus granting sandboxed environments the power to open and control an unsandboxed environment is a major security design flaw.
I hope this answers your question :-)
You cannot directly use the Chrome's Dev Tools from your web pages. It is bundled with the browser.
But you can use it like a regular web application. Go to Chrome Developer Tools, then go to Contributing. You will find help on using Dev Tools for your app.
Setting up
Install Chrome Canary on Mac OS / Windows or download the latest Chromium build from the Chromium continuous builds archive on Linux
Clone Blink git repo from https://chromium.googlesource.com/chromium/blink.git
Set up a local web server that would serve files from WebKit/Source/WebCore/inspector on some port (8090)
Running
Run one copy of Chrome Canary with the following command line flags: --remote-debugging-port=9222 --user-data-dir=blink/chromeServerProfile --remote-debugging-frontend="http://localhost:8090/front_end/inspector.html". These flags cause Chrome to allow websocket connections into localhost:9222 and to serve the front-end UI from your local git repo. (Adjust the path to chromeServerProfile to be some writable directory in your system).
Open a sample page (eg www.chromium.org).
Run a second copy of Chrome Canary with the command line flag: --user-data-dir=/work/chromeClientProfile. Open http://localhost:9222. Among the thumbnails you will see the sample page from the other browser instance. Click on it to start remote debugging your sample page.
The DevTools web page that opens is served from the remote-debugging-frontend in the first browser instance, which serves from the git repo your local filesystem. Debug this Devtools Web page and edit its source like any other web app.
I hope this is what you need.
There's no way to control the web developer tool from an in-page script, other than through the Console API which provides mostly logging facilities. Letting scripts control more than that would be a serious security issue, since it would allow a web page to control parts of the browser.
The only API remotely related to what you're trying to do is the debugger command, which switches to the script pane only if the developer tools were already open.
But who are you trying to develop this feature for?
If it's for developers working on the site, then it's better to just use the existing developer tools manually, by setting breakpoints, or the pause on exceptions toggle.
If it's for end users, don't. Unless your site is supposed to be used by highly technical web developers, you're only going to scare away users if the developer tools suddenly pop up with errors.
If you really want to show errors you can implement your own logging framework and the UI for error reporting, which works with basic JS and doesn't depend on a specific browser environment.
here's another answer that proposes a solution to your mentioned use case/objective (detecting errors, getting & displaying console logs) and not the not possible objective in the title.
you can make and use a console wrapper and use it in your code
and/or you can monkey patch the console functions if you use/import external js, but you need to apply it before loading them.
No, Any secure Browser will not allow a script to open an extension, as it leads to insecurity.
But, You may design an Add-On/extension OR Console API's to do the same.. for specific site.
Create an Add-On like this to achieve that requirement.
You can try sending keys 'CTRL' + SHIFT' + 'I'
that may work for Chrome any FireFox (in I.E you need to use 'F12'
I am using it when required as few utils in this add-on use to work better then the built-in.
EDIT:
Now a days Chrome is advanced with many new advancements source.
I hope this helps!
Hate to answer such an old question, but was surprised to not see this as an answer, so I thought I'd add it in case it can help someone in the future.
Assuming you have access to the source code, you can place an alert("open devtools"); statement immediately before the first line you're interested in debugging. This alert will give you an opportunity to open DevTools and set a breakpoint on that first line before clearing the alert thus allowing the code to continue and hitting the breakpoint.

Javascript and Jquery - IE blocking it running (Galleria)

I have linked to the Jquery library at google in my header, and my local copy of the Galleria Javascript file - as the instructions on the Galleria website said to do.
The code functions perfectly in Chrome. However, when attempting to view the site in IE9 I am faced with "Internet Explorer restricted this webpage from running scripts or ActiveX controls." This is preventing (without user input) the Javascript/Jquery/Galleria stuff to function; it is also prevented an embedded Youtube video from displaying.
What am I missing - plenty of other websites use these functions and I don't get IE giving this message. What do I need to add or change?
I am viewing the website from my PC - it is stored locally at the moment.
Cheers!
This is happening because you are running your website locally. You can be sure that this will not happen once you upload it to a webserver.
You can also run a local webserver. I can recommend WAMP:
http://www.wampserver.com/en/

Chrome blocking javascript on localhost

I'm working on developing a site on my local machine (Windows 7 Ultimate x64) using WAMP, running APACHE v2.2.22, PHP 5.3.13, and MySQL v5.5.24. I'm developing using Chrome v 22.0.1229.94. I've got quite a bit of javascript in the site, however, and Chrome is relentlessly blocking javascript from running on the page.
Clicking on the little 'blocked javascript on this page' icon in the address bar includes the dropdown that has "Always allow Javascript on Localhost" checked off, and I also have a JavaScript exception in Chrome's settings explicitly saying to always allow JavaScript on 'http://localhost'.
Cookies are being allowed, "Allow all sites to run JavaScript" is checked off, and I have no idea as to why Chrome is not allowing the JavaScript to run.
Overall, it's not imperative to the project that I figure out a fix as both IE9 and Firefox 16.1 are allowing JavaScript and I can utilize them. I am simply curious if there's anything I can do to fix this in Chrome, as I would like to continue developing in Chrome.
If you notice that JavaScript is only blocked when the console is open (as some are saying), chances are that you disabled JavaScript in the console settings.
Open the console.
Click the vertical ellipsis icon (or the gear icon on older versions) in the upper right and go to settings.
See if the "Disable JavaScript" checkbox is checked.
I have the same issue, but only when the console is open. When the console is closed, JavaScript loads fine on localhost. Makes it hard to debug things though....
I got around it by opening localhost in an incognito window.
You can give your local server a domain name, may be that would help.
Open C:\Windows\System32\drivers\etc\hosts in notepad
Edit that file add a new line at the end
127.0.0.1 mydomain.com
Save, now goto chrome and type in http://mydomain.com/ this should point to your local server.
Since you nolonger run on "localhost" may be chrome will let you pass.
Let's me know if that works. Good luck!

See stored cookies or debug in browser

I have made a webpage that stores cookies to remember what ID a user has put in a scheme viewer. It works in desktop versions of IE, Firefox and Chrome. But when I try to visit it with Android or iPhone it doesn't work.
What I would like to know is how you see stored cookies or how you debug JavaScript/HTML/CSS. If I look at errors in desktop Firefox I get no errors for JavaScript and CSS.
I recommend you use the remote debugger built into the chrome for android app.
e.g.
Start adb with your phone connected via usb (usb debugging enabled)
Launch chrome, goto settings, developer tools, enable remote debugging.
On your pc in command prompt execute adb forward tcp:9222 localabstract:chrome_devtools_remote
Navigate to localhost:9222 from your pc for live interaction/console from your phone.
Source: https://developers.google.com/chrome-developer-tools/docs/remote-debugging
well i believe that you can't quite view the cookies of the browser in android. are you sure you have cookies enabled? (menu>more>settings>accept cookies should be checked). or if you're using javascript to set the cookies, you'd wanna make sure javascript is also enabled.
to debug, all you can really do is get the cookies via PHP or javascript and print them on the webpage. if they're blank, you for sure know the cookies aren't there. if you wanna see if the javascript is being run at all, just put print a "hello world" to the page at the line above where you set the cookie. (same concepts for php, use an echo)
it's a little fishy that desktop works and not mobile. it could be the fact that mobile browsers aren't rendering the page correctly though this is probably not the case. i would try debugging first and see if your setcookie code is actually being called by with the mobile browsers
hope this helps!
For Android 2.2 or 2.3 you can try this:
Type about:debug in you url bar while on your page;
A javascript debug bar will be opened on top of your url bar;
Type in console.log(document.cookie) and hit evaluate > It should print the cookies
Bear in mind that the js debug bar on Android will only show once the web app logs something ( e.g. if a js error occurs or if you trigger it via console.log so you might want to trigger it inside your app to open)
For Android above 2.3 you have more debug options ;)
EDITED:
As per Zeb's answer check here: https://developers.google.com/chrome-developer-tools/docs/remote-debugging

Categories

Resources