Spoof Geolocation position.heading in Chrome DevTools - javascript

In Chrome DevTools you have the ability to spoof a location to return to the Geolocation API, by putting a lat/lon into the Sensors tab. This works well, but there doesn't seem to be a way to spoof the heading or speed or any of the other properties that are returned.
This makes testing anything that makes use of heading/speed rather difficult, as it just returns null when you override from DevTools. At the moment I am having to load my localhost application onto a real device, then unplug it, take it outside and wander round the streets, which is a little tiresome.
Does anyone know of a way to emulate the heading/speed properties without leaving my seat, either using other dev tools, a plugin or a code snippet.

Related

How to simulate a slow internet connection for the user experience?

I was wondering if it is possible to throttle user internet speed when accessing the website, based on a user choice. This is needed for a small scale test of how users react to different internet speeds. My workaround would be to get the user to manually throttle the speed in chrome dev tools, but I would prefer that as the last option. Any option to achieve this or something similar would be amazing. Thank you.
Edit: Just to clarify I am looking to code the throttling functionality within the website itself so the user won't have to install something or set the Chrome dev tools manually, as I am aware of those solutions already.
What you desire to do is not easily possible due to security reasons. Chrome (and most other browsers) prevent DevTools access from js scripts. A user has to manually and interactively press the buttons on DevTools to change the network speed of the chrome tab.
On your behalf, you should get the UX testers to use the DevTools.
That being said, there are solutions for this. But they might be complex!
Solutions in JS:
Dirty fix:
Create looping data downloader script that performs a DOS attack on the client.
Basically something like:
let delay = 100*(Math.random() +0.5);
setInterval(/*downloadStuff*/, delay);
Issues with this fix:
This creates real network congestion on the client, which might not be optimal.
Introduces web page lag because of CPU usage.
Better, but time consuming fix:
You can simulate a slow network environment by doing the following:
Periodically do request.abort() some ajax and xhr requests. See here and here. And yes, you have to keep references to the remote calls. (Some inspirational code by bruth)
Randomly prevent some images from loading by changing their src attribute for a few second. See here.
And... there are more to it.
Iframes are tricky as they can be from another domain. Chrome does not support cross domain request. To simulate a slow network, you have to stop the iframe once in a while and refresh it using the src attribute, just like the images. You could use window.frames[].stop(), to simulate a frozen/stopped iframe.
Videos are sometimes loaded with iframes, which is again hard to simulate network lag on. Unlike, images, reloading a video will reset the playback time. AFAIK, there are no way to simulate video lag easily (without heavy change of video playback logic).
And... if you are really into it. Go ahead and override different events such as those from GlobalEventHandlers.
Many solutions aside from js
Use Chrome DevTools (easiest as mentioned)
If the site is connected to a server you own. Add delay on before responding to simulate server congestion.
Use/create a Chrome Extension that changes the network speed
Create your own browser that can run the site, and change the network speed accordingly
Install software to control networks settings on the OS
Change the network speed on the router
Not entirely sure what experience you want other than the Chrome dev tools way but here is an alternative.
clumsy makes your network condition on Windows significantly worse, but in a managed and interactive manner
https://jagt.github.io/clumsy/
https://serverfault.com/a/570702

Geolocation spoofing protection in webapp

I am building a web app which offers users certain unlockable feature at certain locations. And I just realized how easy it is to spoof GPS location. Chrome dev tools even offers GeoLocation custom location override setting under sensors. How can I set effective checks for similar hacks?
UPDATE:
Chrome dev tools Geolocation override outputs accuracy of 150m thus IF I set a threshold i.e 40m accuracy (reject all data with accuracy greater than 40m). then that can account for the easy chrome dev tool hack (which is great for testing)
It's not possible to prevent users from spoofing their location. Even if you could prevent it in the client software (and to be clear, you can't), the user could feed a location in via an external GPS (or simply a serial port driver with spoofed location data).
What you can do is watch for signs of this spoofing. You could put in thresholds for location changes and what not. If someone suddenly appears to move further than is reasonable, you could flag the data as suspicious. This isn't ideal though, as sometimes immediate location updates happen. (Suppose your device was in airplane mode before you took off from one city, and then updated as soon as you took it out of airplane mode. For a short time, the phone thinks it is in one place, and then is immediately transported to the correct place.)
In the end, there's nothing you can reliably do about it, in a generic sense.

Chrome extension that changes values in the Preferences file

I'm trying to write a chrome extension that auto-hides the bookmark bar and shows it when you hover over that area. I was able to do this through c++ by listening to the cursor location and using the ctrl-shift-b shortcut. Unfortunately this is not feasible using the extensions API so I'll have to find another solution.
Would it be possible to do this by changing the value of show_on_all_tabs to true in Preferences?
"bookmark_bar":{"show_apps_shortcut":false,"show_on_all_tabs":false}
If so, then how would I go about implementing that in my extension?
Thanks
There's no API available to Google Chrome extensions to change/hook/control the browser UI.
Other Chromium-based browsers may have something of the kind like Opera's sidebar API.
Changing any of the internal files like the Preferences is also not allowed. It's hard to change even externally as you'd need to change Secure Preferences too, properly updating its hashsum.
Sending Ctrl+Shift+B hotkey from inside an extension/webpage is fruitless as well as it will never escape the content sandbox, and won't reach the browser's internal event listener.

Command line chrome extension loading and testing

I'm currently using the "Developer mode" on the chrome://extensions page of the chromium browser, loading it by clicking on "Reload (Ctrl+R)".
I'd like to be able to make a change to my unpacked chrome extension and load it into the browser in an automated way, especially since I'm testing the extension on a virtual machine so doing all this completely headlessly would be ideal. However, I would at least like to avoid having to click every time I want to load my extension, and I'd like to be able to collect any errors produced into a file/tty.
What is the best way of doing this? Does chrome provide tools for automating extension building and testing?
Regarding the other question linked below:
It doesn't really address my problem, since I am looking for a way to get console output, stack traces and any output generated by the extension reload to be accessible via a file/stream in my OS, as opposed to being displayed in a chromium browser window. The linked answers provide a way to reload the extension programmatically, but not much else.
There are a few avenues for you to research.
You could look into enabling logging with a high verbosity. In principle, I would think there is a level that echoes console output; I'm no expert though.
You could use Native Messaging to speak to a daemon that will log things for you; the downside is that you probably can't catch errors this way.
You could take this one step further and create an extension that attaches to your target extension with Remote Debugging protocol (which provides the same info as DevTools) using the chrome.debugger API, and then log stuff with Native Messaging.
Or, you could eschew using an extension as a supervisor and just use/write an external Remote Debugging client.

Is it possible to externally trigger Javascript in Google Chrome from another process, maybe via an extension?

I'd like a local process on my machine to be able to trigger javascript in a specific tab in my local Google Chrome browser. The tab is not connecting to localhost, but to another known domain.
This may sound a bit weird, but what I'm actually trying to do is allow my in-browser music player to be controlled via global OS keyboard shortcuts, so I don't have to go to my tab in Chrome to pause or skip a track, for example.
I haven't been able to find any references to this type of behavior anywhere. Here are some solutions I've though of so far:
I tried looking at the Chrome Extensions APIs, and found the NPAPI Plugins which seem to allow javascript to trigger an external process, but I'm not sure if I could get it to work in the opposite way?
If directly triggering javascript is not possible, I may look into opening an HTML5 WebSocket to a tiny localhost webserver that can push control messages to the browser. I've read that WebSockets can function cross-domain in this way.
If both of the above don't work, I could always have a localhost process push to the remote server, which can forward the message back to my Chrome tab via WebSockets or another callback method. I really hope I can avoid this.
Are there features of Chrome extensions I'm overlooking that can be triggered externally? Or will a NPAPI plugin be able to do what I want? Or is there a better solution for this somehow? These all seem a little needlessly complex for such a simple task.
I would use the NPAPI Plugin becasue it is the best one too use for the thing your doing.
Good luck completing it.

Categories

Resources