Remove angular os-open-external directive

Change-type: patch

lib/gui/app/app.js

@@ -91,10 +91,7 @@ const app = angular.module('Etcher', [
 
   // Pages
   require('./pages/main/main.ts').MODULE_NAME,
-  require('./components/finish/index.ts').MODULE_NAME,
+  require('./components/finish/index.ts').MODULE_NAME
-
-  // OS
-  require('./os/open-external/open-external')
 ])
 
 app.run(() => {

lib/gui/app/components/drive-selector/drive-selector.js

@@ -25,8 +25,7 @@ const MODULE_NAME = 'Etcher.Components.DriveSelector'
 const DriveSelector = angular.module(MODULE_NAME, [
   require('../modal/modal'),
   require('../confirm-modal/confirm-modal'),
-  require('../../utils/byte-size/byte-size'),
+  require('../../utils/byte-size/byte-size')
-  require('../../os/open-external/open-external')
 ])
 
 DriveSelector.controller('DriveSelectorController', require('./controllers/drive-selector'))

lib/gui/app/components/finish/finish.tsx

@@ -17,12 +17,14 @@
 import * as _ from 'lodash';
 import * as React from 'react';
 import * as uuidV4 from 'uuid/v4';
+
 import * as messages from '../../../../shared/messages';
 import * as flashState from '../../models/flash-state';
 import * as selectionState from '../../models/selection-state';
 import * as store from '../../models/store';
 import * as analytics from '../../modules/analytics';
 import * as updateLock from '../../modules/update-lock';
+import { open as openExternal } from '../../os/open-external/services/open-external';
 import { FlashAnother } from '../flash-another/flash-another';
 import { FlashResults } from '../flash-results/flash-results';
 import * as SVGIcon from '../svg-icon/svg-icon';
@@ -88,7 +90,14 @@ function FinishPage({ $state }: any) {
 					<div className="fallback-banner">
 						<div className="caption caption-big">
 							Thanks for using
-							<span os-open-external="https://balena.io/etcher?ref=etcher_offline_banner">
+							<span
+								style={{ cursor: 'pointer' }}
+								onClick={() =>
+									openExternal(
+										'https://balena.io/etcher?ref=etcher_offline_banner',
+									)
+								}
+							>
 								<SVGIcon
 									paths={['../../assets/etcher.svg']}
 									width="165px"
@@ -104,7 +113,12 @@ function FinishPage({ $state }: any) {
 								height="20px"
 							></SVGIcon>
 							by
-							<span os-open-external="https://balena.io?ref=etcher_success">
+							<span
+								style={{ cursor: 'pointer' }}
+								onClick={() =>
+									openExternal('https://balena.io?ref=etcher_success')
+								}
+							>
 								<SVGIcon
 									paths={['../../assets/balena.svg']}
 									width="auto"

lib/gui/app/os/open-external/directives/open-external.js

@@ -1,61 +0,0 @@
-/*
- * Copyright 2016 balena.io
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-'use strict'
-
-const _ = require('lodash')
-
-/**
- * @summary OsOpenExternal directive
- * @function
- * @public
- *
- * @description
- * This directive provides an attribute to open an external
- * resource with the default operating system action.
- *
- * @param {Object} OSOpenExternalService - OSOpenExternalService
- * @returns {Object} directive
- *
- * @example
- * <button os-open-external="https://balena.io">Balena.io</button>
- */
-module.exports = (OSOpenExternalService) => {
-  return {
-    restrict: 'A',
-    scope: false,
-    link: (scope, element, attributes) => {
-      // This directive might be added to elements
-      // other than buttons.
-      element.css('cursor', 'pointer')
-
-      element.on('click', () => {
-        OSOpenExternalService.open(attributes.osOpenExternal)
-      })
-
-      const ENTER_KEY = 13
-      const SPACE_KEY = 32
-      element.on('keypress', (event) => {
-        if (_.includes([ ENTER_KEY, SPACE_KEY ], event.keyCode)) {
-          // Don't spam the user with several tabs if the key is being held
-          if (!event.repeat) {
-            OSOpenExternalService.open(attributes.osOpenExternal)
-          }
-        }
-      })
-    }
-  }
-}

lib/gui/app/os/open-external/open-external.js

@@ -1,46 +0,0 @@
-/*
- * Copyright 2016 balena.io
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-'use strict'
-
-/**
- * @module Etcher.OS.OpenExternal
- */
-
-const angular = require('angular')
-const url = require('url')
-
-const MODULE_NAME = 'Etcher.OS.OpenExternal'
-const OSOpenExternal = angular.module(MODULE_NAME, [])
-OSOpenExternal.service('OSOpenExternalService', require('./services/open-external'))
-OSOpenExternal.directive('osOpenExternal', require('./directives/open-external'))
-
-OSOpenExternal.run((OSOpenExternalService) => {
-  document.addEventListener('click', (event) => {
-    const target = event.target
-    if (target.tagName === 'A' && angular.isDefined(target.href)) {
-      // Electron interprets relative URLs as being relative to the
-      // current loaded URL (with `webContents.loadURL`) and expands
-      // them to the corresponding absolute URL. If it's a `file://`
-      // URL, we don't want it opened in an external browser.
-      if (url.parse(target.href).protocol !== 'file:') {
-        OSOpenExternalService.open(target.href)
-      }
-    }
-  })
-})
-
-module.exports = MODULE_NAME

lib/gui/app/pages/main/main.ts

@@ -32,7 +32,6 @@ import * as driveSelector from '../../components/drive-selector';
 import * as driveSelectorService from '../../components/drive-selector/drive-selector';
 import { MODULE_NAME as flashAnother } from '../../components/flash-another';
 import { MODULE_NAME as flashResults } from '../../components/flash-results';
-import * as openExternal from '../../os/open-external/open-external';
 import * as byteSize from '../../utils/byte-size/byte-size';
 
 export const MODULE_NAME = 'Etcher.Pages.Main';
@@ -43,7 +42,6 @@ const Main = angular.module(MODULE_NAME, [
 	flashAnother,
 	flashResults,
 	driveSelector,
-	openExternal,
 	byteSize,
 ]);
 

lib/gui/app/scss/main.scss

@@ -164,24 +164,11 @@ body {
     margin: 0 13px;
   }
 
-  .caption[os-open-external] {
-    border-bottom: 1px dashed;
-    padding-bottom: 2px;
-
-    &:hover {
-      color: lighten($palette-theme-dark-disabled-foreground, 5%);
-    }
-  }
-
   .footer-right {
     font-size: 10px;
     position: absolute;
     right: 0;
   }
-
-  > span[os-open-external] {
-    display: flex;
-  }
 }
 
 .section-loader {

lib/gui/css/main.css

@@ -9833,17 +9833,10 @@ body {
     padding: 0; }
   .section-footer-main .svg-icon {
     margin: 0 13px; }
-  .section-footer-main .caption[os-open-external] {
-    border-bottom: 1px dashed;
-    padding-bottom: 2px; }
-    .section-footer-main .caption[os-open-external]:hover {
-      color: #85898c; }
   .section-footer-main .footer-right {
     font-size: 10px;
     position: absolute;
     right: 0; }
-  .section-footer-main > span[os-open-external] {
-    display: flex; }
 
 .section-loader webview {
   flex: 0 1;

scripts/html-lint.js

@@ -30,10 +30,6 @@ angularValidate.validate(
     ],
     customattrs: [
 
-      // Internal
-      'os-open-external',
-      'os-dropzone',
-
       // External
       'hide-if-state',
       'show-if-state',

tests/gui/os/open-external.spec.js

@@ -1,61 +0,0 @@
-/*
- * Copyright 2016 balena.io
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-'use strict'
-
-const m = require('mochainon')
-const angular = require('angular')
-const electron = require('electron')
-
-describe('Browser: OSOpenExternal', function () {
-  beforeEach(angular.mock.module(
-    require('../../../lib/gui/app/os/open-external/open-external')
-  ))
-
-  describe('osOpenExternal', function () {
-    let $compile
-    let $rootScope
-
-    beforeEach(angular.mock.inject(function (_$compile_, _$rootScope_) {
-      $compile = _$compile_
-      $rootScope = _$rootScope_
-    }))
-
-    it('should set the element cursor to pointer', function () {
-      const element = $compile('<span os-open-external="https://balena.io">Balena.io</span>')($rootScope)
-      $rootScope.$digest()
-      m.chai.expect(element.css('cursor')).to.equal('pointer')
-    })
-
-    it('should call Electron shell.openExternal with the attribute value', function () {
-      const shellExternalStub = m.sinon.stub(electron.shell, 'openExternal')
-      const element = $compile('<span os-open-external="https://balena.io">Balena.io</span>')($rootScope)
-      element.triggerHandler('click')
-      $rootScope.$digest()
-      m.chai.expect(shellExternalStub).to.have.been.calledWith('https://balena.io')
-      shellExternalStub.restore()
-    })
-
-    it('should not call Electron shell.openExternal if the attribute value is not defined', function () {
-      const shellExternalStub = m.sinon.stub(electron.shell, 'openExternal')
-      const element = $compile('<span os-open-external>Balena.io</span>')($rootScope)
-      element.triggerHandler('click')
-      $rootScope.$digest()
-      m.chai.expect(shellExternalStub).to.not.have.been.called
-      shellExternalStub.restore()
-    })
-  })
-})