title: Button not working in Firefox but does in Chrome
body: <p>I am working on a ReactJS application that I made. Here's the <a href="https://cotdv2048.herokuapp.com/cotd" rel="nofollow noreferrer">deployed version</a> to get a better idea of the problem.</p>
  
  <p>The Login button is not working in Firefox in the <code>Inventory Login</code> section. Rendered HTML shows it as a button, with a listener on it. Hence it should be working.   </p>
  
  <p>Consulting various answers and solutions on StackOverflow regarding buttons in Firefox especially when using JSX have yielded no results. I am pretty sure this doesn't count as interactive content and could still be considered as phrasing as listed <a href="https://stackoverflow.com/questions/30233447/what-is-the-difference-between-phrasing-content-and-flow-content">here</a>.</p>
  
  <p>Here's the code snippet that Inventory Login runs on. </p>
  
  <pre><code>import React from "react";
  
  const Login = props =&gt; (
    &lt;nav className="login"&gt;
      &lt;h2&gt;Inventory Login&lt;/h2&gt;
      &lt;p&gt;Sign in to manage your store's inventory.&lt;/p&gt;
  
      &lt;button className="github" onClick={() =&gt; props.authenticate()}&gt;
        Log In With GitHub
      &lt;/button&gt;
    &lt;/nav&gt;
  );
  
  export default Login;
  
  </code></pre>
  
  <p><code>props.authenticate()</code> is calling a function back in App.js that handles authentication through Firebase. I already verified that it was working on Chrome and the prop is being passed through.</p>
  
  <p>What is unique is - another button <code>ORDER RESET</code> is working in a 
  different component but has almost similar code.</p>
  
  <p>Here's the entire source code - <a href="https://github.com/vipulgupta2048/react-cotd" rel="nofollow noreferrer">https://github.com/vipulgupta2048/react-cotd</a></p>