Merge branch 'master' of github.com:zeit/hyper

app/config-default.js

@@ -64,7 +64,7 @@ module.exports = {
     // the shell to run when spawning a new session (i.e. /usr/local/bin/fish)
     // if left empty, your system's login shell will be used by default
     // make sure to use a full path if the binary name doesn't work
-    // (e.g `C:\\Windows\\System32\\bash.exe` instad of just `bash.exe`)
+    // (e.g `C:\\Windows\\System32\\bash.exe` instead of just `bash.exe`)
     // if you're using powershell, make sure to remove the `--login` below
     shell: '',
 

lib/components/tab.js

@@ -67,7 +67,10 @@ export default class Tab extends Component {
         )}
         onClick={this.handleClick}
         >
-        <span className={css('textInner')}>
+        <span
+          title={this.props.text}
+          className={css('textInner')}
+          >
           { this.props.text }
         </span>
       </span>
@@ -143,7 +146,11 @@ export default class Tab extends Component {
         right: 0,
         top: 0,
         bottom: 0,
-        textAlign: 'center'
+        textAlign: 'center',
+        textOverflow: 'ellipsis',
+        whiteSpace: 'nowrap',
+        padding: '0 25px',
+        overflow: 'hidden'
       },
 
       icon: {

lib/components/term.js

@@ -246,6 +246,11 @@ export default class Term extends Component {
         background: ${this.props.borderColor};
       }
     `;
+    const selectCss = `
+      ::selection {
+        background: ${Color(this.props.cursorColor).alpha(0.4).rgbString()};
+      }
+    `;
     return URL.createObjectURL(new Blob([`
       .cursor-node[focus="false"] {
          border-width: 1px !important;
@@ -255,6 +260,7 @@ export default class Term extends Component {
       }
       ${hyperCaret}
       ${scrollBarCss}
+      ${selectCss}
       ${css}
     `], {type: 'text/css'}));
   }

package.json

@@ -7,6 +7,8 @@
     "build": "cross-env NODE_ENV=production webpack",
     "lint": "xo",
     "test": "npm run lint",
+    "test:unit": "ava test/unit",
+    "test:unit:watch": "npm run test:unit -- --watch",
     "prepush": "npm test",
     "postinstall": "install-app-deps && npm run rebuild-node-pty",
     "rebuild-node-pty": "electron-rebuild -f -w app/node_modules/node-pty -m app",

test/testUtils/is-hex-color.js

@@ -0,0 +1,5 @@
+function isHexColor(color) {
+  return /(^#[0-9A-F]{6,8}$)|(^#[0-9A-F]{3}$)/i.test(color); // https://regex101.com/
+}
+
+module.exports.isHexColor = isHexColor;

test/unit/to-electron-background-color.test.js

@@ -0,0 +1,52 @@
+import test from 'ava';
+import toElectronBackgroundColor from '../../app/utils/to-electron-background-color';
+import {isHexColor} from '../testUtils/is-hex-color';
+
+test('toElectronBackgroundColor', t => {
+  t.false(false);
+});
+
+test(`returns a color that's in hex`, t => {
+  const hexColor = '#BADA55';
+  const rgbColor = 'rgb(0,0,0)';
+  const rgbaColor = 'rgb(0,0,0, 55)';
+  const hslColor = 'hsl(15, 100%, 50%)';
+  const hslaColor = 'hsl(15, 100%, 50%, 1)';
+  const colorKeyword = 'pink';
+
+  t.true(
+    isHexColor(
+      toElectronBackgroundColor(hexColor)
+    )
+  );
+
+  t.true(
+    isHexColor(
+      toElectronBackgroundColor(rgbColor)
+    )
+  );
+
+  t.true(
+    isHexColor(
+      toElectronBackgroundColor(rgbaColor)
+    )
+  );
+
+  t.true(
+    isHexColor(
+      toElectronBackgroundColor(hslColor)
+    )
+  );
+
+  t.true(
+    isHexColor(
+      toElectronBackgroundColor(hslaColor)
+    )
+  );
+
+  t.true(
+    isHexColor(
+      toElectronBackgroundColor(colorKeyword)
+    )
+  );
+});