add button text tests

__tests__/ButtonSetter.test.js

@@ -80,6 +80,21 @@ describe('ButtonSetter', () => {
     // });
   });
 
+  describe('setButtonにボタンのテキストを指定するとそれが入る', () => {
+    const className = 'hogeclass';
+    const imgSrcs = ['src1', 'src2'];
+    const getImgSrcs = () => imgSrcs;
+    const target = document.createElement('div');
+    const text = '原寸';
+
+    const buttonSetter = new ButtonSetter();
+    buttonSetter.setButton({ className, getImgSrcs, target, text });
+
+    it('指定したテキストでボタン設置される', () => {
+      expect(target.innerHTML).toMatchSnapshot();
+    });
+  });
+
   describe('setReactLayoutButton', () => {
     const className = 'hogeclass';
     const imgSrcs = ['src1', 'src2'];

__tests__/ButtonSetterTweetDeck.test.js

@@ -504,6 +504,55 @@ describe('ButtonSetterTweetDeck', () => {
         expect(styles.cursor).toStrictEqual('pointer');
       });
     });
+
+    describe('ボタンのテキストを指定するとそれが入る', () => {
+      document.body.innerHTML = '';
+
+      const root = document.createElement('div');
+      root.classList.add('txt-mute');
+      root.style.color = '#123456';
+
+      const target = document.createElement('footer');
+      root.appendChild(target);
+      document.body.appendChild(root);
+
+      const text = '原寸';
+
+      const buttonSetter = new ButtonSetterTweetDeck();
+      buttonSetter.setButton({ className, getImgSrcs, target, text });
+
+      const button = target.querySelector(`a.${className}`);
+
+      it('ボタン設置される', () => {
+        expect(button).toBeTruthy();
+        expect(target.innerHTML).toMatchSnapshot();
+      });
+
+      it('ボタンにスタイルついている', () => {
+        const styles = button.style;
+        expect(styles.border).toStrictEqual('1px solid rgb(18, 52, 86)'); // #123456 -> rgb(18, 52, 86)
+        expect(styles.borderRadius).toStrictEqual('2px');
+        expect(styles.display).toStrictEqual('inline-block');
+        expect(styles.fontSize).toStrictEqual('0.75em');
+        expect(styles.marginTop).toStrictEqual('5px');
+        expect(styles.padding).toStrictEqual('1px 1px 0px');
+        expect(styles.lineHeight).toStrictEqual('1.5em');
+        expect(styles.cursor).toStrictEqual('pointer');
+      });
+
+      /* SKIP: なぜかうまくmockできないので飛ばす */
+      // it('ボタン押すとonClick呼ばれる', () => {
+      //   main.onOriginalButtonClick = jest.fn();
+      //   button.click();
+      //   expect(main.onOriginalButtonClick).toHaveBeenCalledTimes(1);
+      //   expect(main.onOriginalButtonClick.mock.calls[0][0]).toBeInstanceOf(
+      //     MouseEvent
+      //   );
+      //   expect(main.onOriginalButtonClick.mock.calls[0][1]).toStrictEqual(
+      //     imgSrcs
+      //   );
+      // });
+    });
   });
 
   describe('getBackgroundImageUrl', () => {

__tests__/__snapshots__/ButtonSetter.test.js.snap

@@ -2,4 +2,6 @@
 
 exports[`ButtonSetter setButton ボタン設置される 1`] = `"<div class="ProfileTweet-action hogeclass"><input class="tooi-button" style="width: 70px; font-size: 13px; color: rgb(105, 123, 140);" type="button" value="Original"></div>"`;
 
+exports[`ButtonSetter setButtonにボタンのテキストを指定するとそれが入る 指定したテキストでボタン設置される 1`] = `"<div class="ProfileTweet-action hogeclass"><input class="tooi-button" style="width: 70px; font-size: 13px; color: rgb(105, 123, 140);" type="button" value="原寸"></div>"`;
+
 exports[`ButtonSetter setReactLayoutButton ボタン設置される 1`] = `"<div class="hogeclass" style="display: flex; flex-flow: column; justify-content: center;"><input type="button" value="Original" style="font-size: 13px; padding: 4px 8px; color: rgb(105, 123, 140); background-color: rgba(0, 0, 0, 0); border: 1px solid #697b8c; border-radius: 3px; cursor: pointer;"></div>"`;

__tests__/__snapshots__/ButtonSetterTweetDeck.test.js.snap

@@ -3,3 +3,5 @@
 exports[`ButtonSetterTweetDeck setButton txt-muteある ボタン設置される 1`] = `"<a class="pull-left margin-txs txt-mute hogeclass" style="border: 1px solid rgb(18, 52, 86); border-radius: 2px; display: inline-block; font-size: 0.75em; margin-top: 5px; padding: 1px 1px 0px; line-height: 1.5em; cursor: pointer;">Original</a>"`;
 
 exports[`ButtonSetterTweetDeck setButton txt-muteない ボタン設置される 1`] = `"<a class="pull-left margin-txs txt-mute hogeclass" style="border: 1px solid #697b8c; border-radius: 2px; display: inline-block; font-size: 0.75em; margin-top: 5px; padding: 1px 1px 0px; line-height: 1.5em; cursor: pointer;">Original</a>"`;
+
+exports[`ButtonSetterTweetDeck setButton ボタンのテキストを指定するとそれが入る ボタン設置される 1`] = `"<a class="pull-left margin-txs txt-mute hogeclass" style="border: 1px solid rgb(18, 52, 86); border-radius: 2px; display: inline-block; font-size: 0.75em; margin-top: 5px; padding: 1px 1px 0px; line-height: 1.5em; cursor: pointer;">原寸</a>"`;