Преглед изворни кода

Prepare setup for compose area UI tests

Danilo Bargen пре 6 година
родитељ
комит
dd2d464143

+ 3 - 1
package.json

@@ -7,7 +7,9 @@
     "build:js": "browserify -p tsify src/app.ts -t [ babelify --presets [ es2015 ] --extensions .ts ] -p [ browserify-header --file header.js ] -o dist/app.js",
     "build:css": "node-sass -o public/css/ --output-style compressed src/sass/",
     "build:css:watch": "node-sass -w -r --source-map true --source-map-embed true -o public/css/ --output-style compressed src/sass/",
-    "build:tests": "browserify -p tsify tests/ts/main.ts -t [ babelify --presets [ es2015 ] --extensions .ts ] -o dist/ts-tests.js",
+    "build:tests": "npm run build:unittests && npm run build:uitests",
+    "build:unittests": "browserify -p tsify tests/ts/main.ts -t [ babelify --presets [ es2015 ] --extensions .ts ] -o dist/ts-tests.js",
+    "build:uitests": "npm run build:css && browserify -p tsify tests/ui/main.ts -t [ babelify --presets [ es2015 ] --extensions .ts ] -o dist/ui-tests.js",
     "dist": "npm run build && echo \"\" && node dist/build-package.js",
     "serve:live": "echo 'NOTE: serve:live command has been renamed to devserver'",
     "devserver": "npm run build:css && concurrently --kill-others --names \"css,server\" -p name \"npm run build:css:watch\" \"budo src/app.ts:dist/app.js -d public -d . -d src --live -- -d -p tsify -t [ babelify --presets [ es2015 ] --extensions .ts ]\"",

+ 0 - 1
src/directives/compose_area.ts

@@ -864,7 +864,6 @@ export default [
                 <div class="emoji-keyboard">
                     <ng-include src="'partials/emoji-picker.html'" include-replace></ng-include>
                 </div>
-
             `,
         };
     },

+ 1 - 1
src/sass/sections/_compose_area.scss

@@ -1,4 +1,4 @@
-#conversation #conversation-footer compose-area {
+compose-area {
 
     > div:first-child {
         display: flex;

+ 38 - 0
tests/ui/compose_area.html

@@ -0,0 +1,38 @@
+<!DOCTYPE html>
+<html ng-strict-di>
+<head>
+    <meta charset="utf-8">
+
+    <!-- Third party -->
+    <script src="../../public/libs/emojione/emojione.min.js?v=[[VERSION]]"></script>
+
+    <!-- Third party stylesheets -->
+    <link rel="stylesheet" href="../../node_modules/angular/angular-csp.css?v=[[VERSION]]">
+    <link rel="stylesheet" href="../../node_modules/angular-material/angular-material.min.css?v=[[VERSION]]">
+    <link rel="stylesheet" href="../../public/libs/emojione/emojione-sprite-32.min.css?v=[[VERSION]]">
+    <link rel="stylesheet" href="../../public/fonts/roboto.css?v=[[VERSION]]" type="text/css">
+    <link rel="stylesheet" href="../../public/fonts/material.css?v=[[VERSION]]" type="text/css">
+
+    <!-- Own stylesheets -->
+    <link rel="stylesheet" href="../../public/css/app.css?v=[[VERSION]]">
+
+    <!-- Scripts -->
+    <script src="../../dist/ui-tests.js"></script>
+    <script>window.uiTests.initComposeArea();</script>
+</head>
+<body ng-app="uitest">
+    <div ng-controller="ComposeAreaController as ctrl">
+        <compose-area
+            submit="ctrl.submit"
+            initial-data="ctrl.initialData"
+            start-typing="ctrl.startTyping"
+            on-typing="ctrl.onTyping"
+            stop-typing="ctrl.stopTyping"
+            on-key-down="ctrl.onComposeKeyDown"
+            on-uploading="ctrl.onUploading"
+            max-text-length="ctrl.maxTextLength"
+            emoji-image-path="../../public/img/e1/">
+        </compose-area>
+    <div>
+</body>
+</html>

+ 103 - 0
tests/ui/compose_area.ts

@@ -0,0 +1,103 @@
+/**
+ * Copyright © 2016-2018 Threema GmbH (https://threema.ch/).
+ *
+ * This file is part of Threema Web.
+ */
+
+// tslint:disable:no-console
+// tslint:disable:no-reference
+
+// Import AngularJS
+import * as angular from 'angular';
+import 'angular-material';
+import 'angular-translate';
+
+// Import types
+import '../../src/threema.d';
+
+// Import dependencies
+import config from '../../src/config';
+import '../../src/directives';
+import '../../src/filters';
+import '../../src/services';
+
+export function init() {
+    console.info('Init UI Test: compose_area');
+
+    const app = angular.module('uitest', [
+        '3ema.directives',
+        '3ema.filters',
+        '3ema.services',
+        'ngMaterial',
+        'pascalprecht.translate',
+    ]);
+    app.constant('CONFIG', config);
+    app.controller('ComposeAreaController', ComposeAreaController);
+
+    // Provide mock translations
+    app.config(function($translateProvider) {
+        $translateProvider.translations('en', {
+            messenger: {
+                COMPOSE_MESSAGE: 'compose_message',
+                COMPOSE_MESSAGE_DRAGOVER: 'compose_message_dragover',
+            },
+        });
+        $translateProvider.preferredLanguage('en');
+    });
+
+    // Fix paths
+    app.config(['$httpProvider', ($httpProvider: ng.IHttpProvider) => {
+        $httpProvider.interceptors.push([() => {
+            return {
+                request: (conf) => {
+                    if (conf.url.indexOf('partials/') !== -1 ||
+                        conf.url.indexOf('directives/') !== -1 ||
+                        conf.url.indexOf('components/') !== -1) {
+                        conf.url = '../../src/' + conf.url;
+                    } else if (conf.url.indexOf('css/') !== -1 ||
+                        conf.url.indexOf('fonts/') !== -1 ||
+                        conf.url.indexOf('i18n/') !== -1 ||
+                        conf.url.indexOf('img/') !== -1 ||
+                        conf.url.indexOf('libs/') !== -1 ||
+                        conf.url.indexOf('sounds/') !== -1) {
+                        conf.url = '../../public/' + conf.url;
+                    }
+                    return conf;
+                },
+            };
+        }]);
+    }]);
+}
+
+export class ComposeAreaController {
+    public static $inject = [];
+
+    public initialData: threema.InitialConversationData;
+
+    constructor() {
+        this.initialData = {
+            draft: '',
+            initialText: '',
+        };
+    }
+
+    public startTyping() {
+        // ignore
+    }
+
+    public onTyping() {
+        // ignore
+    }
+
+    public stopTyping() {
+        // ignore
+    }
+
+    public onComposeKeyDown() {
+        return true;
+    }
+
+    public submit(msgtype, data) {
+        // ignore
+    }
+}

+ 12 - 0
tests/ui/main.ts

@@ -0,0 +1,12 @@
+/**
+ * Copyright © 2016-2018 Threema GmbH (https://threema.ch/).
+ *
+ * This file is part of Threema Web.
+ */
+
+import {init as initComposeArea} from './compose_area';
+
+// Expose global functions
+(window as any).uiTests = {
+    initComposeArea: initComposeArea,
+};