link: remove styles attribute from child (#911)

Summary:
By using `<a {...this.props}>{children}</a>`, we were forwarding the
Aphrodite selectors as `styles`. This caused the static HTML for the
page to include `<a styles="[object Object]">`, which is annoying.

Test Plan:
Unit tests extended: they fail before this change and pass after it.
Also clicked a router link and an external link in the application.

wchargin-branch: link-child-styles

src/app/Link.js

@@ -30,16 +30,23 @@ type LinkProps = $ReadOnly<{
 }>;
 export default class Link extends Component<LinkProps> {
   render() {
-    const linkClass = css(styles.link, this.props.styles);
+    const {styles: customStyles, children, ...rest} = this.props;
+    const linkClass = css(styles.link, customStyles);
     const className = this.props.className
       ? `${linkClass} ${this.props.className}`
       : linkClass;
-    const Tag = "to" in this.props ? RouterLink : "a";
+    const make = (Tag) => (
-    return (
+      <Tag {...rest} className={className}>
-      <Tag {...this.props} className={className}>
+        {children}
-        {this.props.children}
       </Tag>
     );
+    if ("to" in this.props) {
+      return make(RouterLink);
+    } else if ("href" in this.props) {
+      return make("a");
+    } else {
+      throw new Error("Must specify either 'to' or 'href'.");
+    }
   }
 }
 

src/app/Link.test.js

@@ -45,6 +45,14 @@ describe("src/app/Link", () => {
     expect(typeof element.prop("className")).toBe("string");
   });
 
+  it("fails if neither `to` nor `href` is provided", () => {
+    // $ExpectFlowError
+    const component = <Link>uhhhhh</Link>;
+    expect(() => {
+      shallow(component);
+    }).toThrow("Must specify either 'to' or 'href'.");
+  });
+
   it("has deterministic className", () => {
     const e1 = shallow(<Link href="#" />);
     const e2 = shallow(<Link href="#" />);
@@ -55,6 +63,7 @@ describe("src/app/Link", () => {
     const e1 = shallow(<Link href="#" />);
     const e2 = shallow(<Link href="#" styles={[styles.x]} />);
     expect(e2.prop("className")).not.toEqual(e1.prop("className"));
+    expect(e2.props()).not.toHaveProperty("styles");
   });
 
   it("forwards class name", () => {