top | item 5375642

Bulletproof demos using Chrome's playback mode

222 points| zackbloom | 13 years ago |dev.hubspot.com | reply

35 comments

order
[+] gojomo|13 years ago|reply
Anyone know where the recorded content is stored, and whether it's kept segregated from other cached content? This could be a really interesting archival format...
[+] inafield|13 years ago|reply
Even more awesome would be the ability to send the recorded content to someone.
[+] ryankshaw|13 years ago|reply
I would be interested in recording the actual order of http requests and being able to replay them on the commandline.

something like open -a "Google Chrome" --args --record-mode --output-file output.log

then: some-command-that-plays-it-back --infile output.log

does anyone know if something like that exists?

[+] jonny_eh|13 years ago|reply
This would make tests so much easier!
[+] DCoder|13 years ago|reply
It doesn't record where you click or what you open, just every request as it moves over the wire.

I am getting quite different results - it records http requests and user input (keyboard/mouse).

Windows 7 x64, Chrome 25.0.1364.172 m :

  # navigate to chrome directory
  cd C:\Users\User\AppData\Local\Google\Chrome\Application\
  # run chrome with a new profile
  chrome --user-data-dir="../User Data/recording_test" --first-run --record-mode
  # use the new chrome profile to browse around
  # close chrome
  # launch it in playback mode
  chrome --user-data-dir="../User Data/recording_test" --playback-mode
  # watch disaster ensue as it locks your mouse (not keyboard), 
  #   replays all activity (url bar input, navigation, mouse cursor movements...), 
  #   and doesn't even stop when you alt-tab 
  #   to a different application
It feels unpolished - mouse scroll wasn't recorded, the "translate this page?" bar wasn't showing up the same way as in the recording, and most importantly, I managed to switch to a different application and it continued sending input to that application. HTTP requests did get cached as promised, and non-cached requests (due to missing scroll event, it clicked on a different link) resulted in a cache error.
[+] mickdarling|13 years ago|reply
Unfortunately my site works directly with embedded Hulu videos and it doesn't seem like this process can replay those videos from the cache.

I JUST dealt with bad data speeds at SXSW while demoing for @scobleizer so this would have been great for the future.

[+] est|13 years ago|reply
I thought Chrome could record your navigation actions .e.g input URL and click elements, it turned out to be directly cache of URL contents so you could read from cache later...

Anyway, cool concept, except it doesn't work with X-Content-Type-Options: nosniff, or ajax call with timestamp parameters.

[+] ErikRogneby|13 years ago|reply
This would be great for capturing usability tests as well.
[+] Mahn|13 years ago|reply
Not really, if I understand correctly this is capturing only the requests, "caching" them in a way, so when on playback mode if you do an action that fires this request, it's fetched from the recorded store.

I think its use is limited to what the article suggests: making sure real life demos don't break.

[+] andrewaylett|13 years ago|reply
There's a similar trick built into fiddler, too, although that's Windows only. Does anyone know of a cross-platform equivalent for Firefox?
[+] Neepy|13 years ago|reply
Any idea what the command is for windows?

start /b "" "C:\Users\User\AppData\Local\Google\Chrome\Application\chrome.exe" --args --record-mode

doesn't seem to work

[+] snarfy|13 years ago|reply
1. Close all chrome windows, open a cmd prompt, then cd to c:\users\user\appdata\local\google\chrome\application

2. run chrome.exe --record-mode ( /record-mode also works)

3. navigate in a predetermined way, then close chrome

4. run chrome.exe --playback-mode ( /playback-mode also works)

5. navigate in the same predetermined way. Those clicks will all work. Any other clicks will not work and result in 'cache miss' errors.

[+] zackbloom|13 years ago|reply
--args is an option to the OS X open command, you shouldn't need it on windows. My guess is:

start /b "" "C:\Users\User\AppData\Local\Google\Chrome\Application\chrome.exe" --record-mode

Report back if it works!

[+] DCoder|13 years ago|reply
Create a separate profile or close _all_ open Chrome windows first.

  "c:\path\to\chrome\dir\chrome" --user-data-dir="c:\path\to\chrome\dir\User Data/test" --record-mode
[+] bdcravens|13 years ago|reply
If you're going to go to the trouble of running something from the terminal (even if you save time with a bash/batch script), why would you prefer this over Selenium? With Selenium you can customize the actions, extend using your favorite language (such as adding pauses or pulling inputs from a database), and if you use Firefox, you can get the same recording ability (only you can save the file and can extend via JavaScript)
[+] ffk|13 years ago|reply
Selenium solves a different problem. With selenium, you record user actions, and verify properties about the state of the site.

The record/playback feature is designed to make a copy of the content you look at during a session, allowing you to retrieve it offline at a later time by revisiting the page (or making equivalent HTTP calls).

Interestingly, if you use both together, you can design a offline-mode reader for hacker news for use on the train or other disconnected environments. Or, combine selenium and playback mode to create kick ass demos that are less likely to fail on weak wifi networks. :)

[+] j_s|13 years ago|reply
This Chrome feature is useful for 'I'm going up on stage to demo my product' scenarios, thus the

  > even if your servers have exploded, a bug has been 
  > deployed, or the conference wifi has dropped out
[+] uptown|13 years ago|reply
Very cool. Is there a switch to direct Chrome to ignore the cache and pull fresh data from the server?
[+] jakub_g|13 years ago|reply
chrome --disk-cache-size=1 --media-cache-size=1

1 is a size in bytes (must be >0).

[+] MikeKusold|13 years ago|reply
Go to: Developer Tools (F12) -> Settings (bottom right gear)

Then there is a setting to disable cache. Although I have heard reports that it doesn't completely work, but that might have been fixed by now.

[+] bthomas|13 years ago|reply
Not sure if this is what you're looking for, but Command-Shift-R refreshes a page ignoring cache
[+] nsoun|13 years ago|reply
Interesting... I wasn't aware of this, I'll definitely give it a shot.

Thanks for the heads-up!