From 2b704bbfb42f3ea06bf3976d589626436f138c67 Mon Sep 17 00:00:00 2001
From: crisbeto <crisbeto@abv.bg>
Date: Fri, 4 Nov 2016 19:45:16 +0100
Subject: [PATCH] fix(radio): radio buttons not being a tab stop and missing
 focus indication

* Fixes the radio buttons not being tabable.
* Adds focus indication to the radio buttons.

Referencing #421.
---
 scripts/browserstack/start_tunnel.sh | 72 ----------------------------
 src/lib/radio/radio.html             |  3 +-
 src/lib/radio/radio.spec.ts          | 18 +++++++
 3 files changed, 20 insertions(+), 73 deletions(-)
 delete mode 100755 scripts/browserstack/start_tunnel.sh

diff --git a/scripts/browserstack/start_tunnel.sh b/scripts/browserstack/start_tunnel.sh
deleted file mode 100755
index de270502a489..000000000000
--- a/scripts/browserstack/start_tunnel.sh
+++ /dev/null
@@ -1,72 +0,0 @@
-#!/bin/bash
-
-set -e -o pipefail
-
-# Workaround for Travis CI cookbook https://github.com/travis-ci/travis-ci/issues/4862,
-# where $PATH will be extended with relative paths to the NPM binaries.
-PATH=`echo $PATH | sed -e 's/:\.\/node_modules\/\.bin//'`
-
-TUNNEL_FILE="BrowserStackLocal-linux-x64.zip"
-TUNNEL_URL="https://www.browserstack.com/browserstack-local/$TUNNEL_FILE"
-TUNNEL_DIR="/tmp/browserstack-tunnel"
-TUNNEL_LOG="$LOGS_DIR/browserstack-tunnel.log"
-
-BROWSER_STACK_ACCESS_KEY=`echo $BROWSER_STACK_ACCESS_KEY | rev`
-
-# Cleanup and create the folder structure for the tunnel connector.
-rm -rf $TUNNEL_DIR $BROWSER_PROVIDER_READY_FILE
-mkdir -p $TUNNEL_DIR
-touch $TUNNEL_LOG
-
-cd $TUNNEL_DIR
-
-# Download the browserstack local binaries.
-curl $TUNNEL_URL -o $TUNNEL_FILE 2> /dev/null 1> /dev/null
-
-# Extract the browserstack local binaries from the tarball.
-mkdir -p browserstack-tunnel
-unzip -q $TUNNEL_FILE -d browserstack-tunnel
-
-# Cleanup the download directory.
-rm $TUNNEL_FILE
-
-ARGS=""
-
-# Set tunnel-id only on Travis, to make local testing easier.
-if [ ! -z "$TRAVIS_JOB_NUMBER" ]; then
-  ARGS="$ARGS --local-identifier $TRAVIS_JOB_NUMBER"
-fi
-
-echo "Starting Browserstack Local in the background, logging into:"
-echo "  $TUNNEL_LOG"
-echo "  ---"
-echo "  $ARGS"
-
-# Extension to the BrowserStackLocal binaries, because those can't create a readyfile.
-function create_ready_file {
-
-  # To be able to exit the tail properly we need to have a sub shell spawned, which is
-  # used to track the state of tail.
-  { sleep 120; touch $BROWSER_PROVIDER_ERROR_FILE; } &
-
-  TIMER_PID=$!
-
-  # Disown the background process, because we don't want to show any messages when killing
-  # the timer.
-  disown
-
-  # When the tail recognizes the `Ctrl-C` log message the BrowserStack Tunnel is up.
-  {
-    tail -n0 -f $TUNNEL_LOG --pid $TIMER_PID | { sed '/Ctrl/q' && kill -9 $TIMER_PID; };
-  } &> /dev/null
-
-  echo
-  echo "BrowserStack Tunnel ready"
-
-  touch $BROWSER_PROVIDER_READY_FILE
-}
-
-browserstack-tunnel/BrowserStackLocal -k $BROWSER_STACK_ACCESS_KEY $ARGS &>> $TUNNEL_LOG &
-
-# Wait for the tunnel to be ready and create the readyfile with the Browserstack PID
-create_ready_file &
diff --git a/src/lib/radio/radio.html b/src/lib/radio/radio.html
index 9fdf1080dc68..d0907e5f4dd2 100644
--- a/src/lib/radio/radio.html
+++ b/src/lib/radio/radio.html
@@ -1,6 +1,7 @@
 <!-- TODO(jelbourn): render the radio on either side of the content -->
 <!-- TODO(mtlin): Evaluate trade-offs of using native radio vs. cost of additional bindings. -->
-<label [attr.for]="inputId" class="md-radio-label">
+<!-- TODO(crisbeto): only show focus indication if focus came from a keyboard event -->
+<label [attr.for]="inputId" class="md-radio-label" [class.md-ripple-focused]="_isFocused">
   <!-- The actual 'radio' part of the control. -->
   <div class="md-radio-container">
     <div class="md-radio-outer-circle"></div>
diff --git a/src/lib/radio/radio.spec.ts b/src/lib/radio/radio.spec.ts
index 4773555ba77e..3e93edccec68 100644
--- a/src/lib/radio/radio.spec.ts
+++ b/src/lib/radio/radio.spec.ts
@@ -574,6 +574,24 @@ describe('MdRadio', () => {
         expect(document.activeElement).toBe(fruitRadioNativeInputs[i]);
       }
     });
+
+    it('should add a ripple when the native input element is focused', () => {
+      let hostElement = seasonRadioInstances[0].getHostElement() as HTMLElement;
+      let input = hostElement.querySelector('input') as HTMLInputElement;
+      let label = hostElement.querySelector('label') as HTMLLabelElement;
+
+      expect(label.classList).not.toContain('md-ripple-focused');
+
+      dispatchEvent('focus', input);
+      fixture.detectChanges();
+
+      expect(label.classList).toContain('md-ripple-focused');
+
+      dispatchEvent('blur', input);
+      fixture.detectChanges();
+
+      expect(label.classList).not.toContain('md-ripple-focused');
+    });
   });
 });