[Sync] Add a simple UI to sync-internals to create UserEvents.

components/sync/driver/resources/user_events.js

+// Copyright 2017 The Chromium Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+cr.define('chrome.sync.user_events', function() {
+  function write() {
+    chrome.sync.writeUserEvent(
+        document.getElementById('event-time-usec-input').value,

[Dan Beam, 2017/05/16 03:35:52]

can you just use $('event-time-usec-input') instead of
document.getElementById()?

[skym, 2017/05/16 19:26:49]

Done. Changed sync_index.js's usage of document.getElementById as well.

Can you explain to me what's going on with this $('id') syntax? Googling for
this functionality is seems kind of like jquery but it doesn't contain a '#'.
Have we defined this lookup mechanism ourselves within our internal Chrome web
ui somewhere?

Also, why exactly is the $('id') version superior to the
document.getElementById('id') approach? Just because it's shorter and consistent
with the rest of the code? Or does it actually do something different?

I'm realizing some other .js files in this folder setup dependencies like

// require: cr.js
// require: cr/ui.js
// require: cr/ui/tree.js

I'm having a very difficult time figuring out code prompts the cr.js dependency.
Should I be doing any of this in user_events.js or sync_index.js?

+        document.getElementById('navigation-id-input').value);
+  }
+
+  function onLoad() {
+    $('create-event-button').addEventListener('click', write);
+  }
+
+  return {
+    onLoad: onLoad
+  };
+});
+
+document.addEventListener(
+    'DOMContentLoaded',
+    chrome.sync.user_events.onLoad,
+    false);
+