options/guest mode: only hide the 'Show advanced settings...' link when

chrome/browser/resources/options/browser_options.html

 <div id="settings" class="page" hidden>
   <header>
     <h1 i18n-content="settingsTitle"></h1>
   </header>
   <include src="reset_profile_settings_banner.html">
   <include src="automatic_settings_reset_banner.html">
 <if expr="chromeos">
   <include src="secondary_user_banner.html">
   <section>
     <div id="network-section-header" class="section-header">
@@ skipping 979 matching lines @@
     <h3 i18n-content="resetProfileSettingsSectionTitle"></h3>
     <div>
       <span class="settings-row" i18n-content="resetProfileSettingsDescription">
       </span>
       <button id="reset-profile-settings" i18n-content="resetProfileSettings">
       </button>
     </div>
   </section>
   </div>  <!-- advanced-settings-container -->
   </div>  <!-- advanced-settings -->
-  <footer>
+  <footer id="advanced-settings-footer">

[Mike Lerman, 2015/01/29 17:56:44]

Why give the footer an id? Can't you jquery-select the footer with just
$('footer')?

[Dan Beam, 2015/01/29 20:07:15]

$() is document.getElementById, not jQuery's sizzle.

I added an ID because doing

  document.querySelector('footer').hidden = true;

breaks if another <footer> is added above it in the page.

  var footers = document.querySelectorAll('footer');
  assert(footers.length == 1);
  footers[0].hidden = true;

is brittle and overkill.

  document.querySelector('#advanced-settings + footer').hidden = true;

breaks if they're not direct siblings and

  document.querySelector('#advanced-settings ~ footer').hidden = true;

is fragile if there's another <footer> added between them.

adding an ID is the only way that doesn't break with a different DOM.

     <a is="action-link" id="advanced-settings-expander"
         i18n-content="showAdvancedSettings"></a>
   </footer>
 </div>