Custom styles are not shown on button

[sammce]

Pull request link

Problem

I was trying to customise the GoogleLogin button's styles, and found out that this is not possible. As any programmer would, I decided to fork the repo and do it myself.

Upon completion, I ran the test suite and saw that it's intended for the styles not to work?

This is the message I got when i ran npm test:

This is despite a custom style being set in the tests, as shown below:

tests/google-login.test.js

Line 98, in test suite "With custom class and custom style":

describe('With custom class and custom style', () => {
  const className = 'test-class'
  const style = { color: 'red' }
  const props = {
    onSuccess() {},
    ...

Essentially, there is custom styles being set, yet they are not expected to be set on the rendered button.
This was the root of my problem, and I don't understand why this would be the intended behaviour. Feel free to correct me if there is a valid reason

Fixes

Below are the fixes that I made to my repo:

src/google-login.js

Line 19, in props destructuring:

...
disabledStyle,
+ style,
buttonText,
...

Line 85, after initialStyles definition:

 ...
 fontWeight: "500",
   fontFamily: "Roboto, sans-serif",
 };

+ if (style) {
+   Object.keys(style).forEach(key => {
+       initialStyle[key] = style[key])
+     };
+ }

const hoveredStyle = {
  cursor: "pointer",
  opacity: 0.9,
};

test/snapshots/google-login.test.js.snap

Line 111, in "Google Login With custom class and custom style has inline styles 1" snapshot:

- "color": "rgba(0, 0, 0, .54)",
+ "color": "red",

Line: 137, in "Google Login With custom class and custom style render the button 1" snapshot:

- "color": "rgba(0, 0, 0, .54)",
+ "color": "red",

Result

With these amendments, the following is now possible:

Before

After

[domdomegg]

Duplicate of #201?

[sammce]

@domdomegg

Apologies, didn't see it when I was looking for an existing issue. Closing this one in favour of the existing one.