Merge pull request #8826 from keymanapp/fix/web/browser-float-ui

fix(web): modularizes Web's Button-style and Float-style keyboard menus, converts them fully to TS 🧩
This commit is contained in:
Joshua Horton 2023-05-30 08:43:31 +07:00 • committed by GitHub
commit c953b24af0
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
16 changed files with 1188 additions and 1057 deletions

View file

@ -19,7 +19,7 @@ module.exports = function(config) {
// level of logging
// possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
// Can't set in base.conf.js b/c of constant's definition style.
// Can't set in base.conf.cjs b/c of constant's definition style.
logLevel: config.LOG_INFO
};

View file

@ -18,7 +18,7 @@ module.exports = function(config) {
// level of logging
// possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
// Can't set in base.conf.js b/c of constant's definition style.
// Can't set in base.conf.cjs b/c of constant's definition style.
logLevel: config.LOG_INFO
};

View file

@ -18,7 +18,7 @@ module.exports = function(config) {
// level of logging
// possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
// Can't set in base.conf.js b/c of constant's definition style.
// Can't set in base.conf.cjs b/c of constant's definition style.
logLevel: config.LOG_INFO
};

View file

@ -72,7 +72,6 @@
"@keymanapp/web-sentry-manager": "*",
"@sentry/cli": "2.2.0",
"chai": "^4.3.4",
"google-closure-compiler-java": "^20200224.0.0",
"karma": "^6.4.1",
"karma-browserstack-launcher": "^1.6.0",
"karma-chai": "^0.1.0",

View file

@ -8,6 +8,7 @@ import {
} from "keyman/engine/dom-utils";
import { DomEventTracker } from "keyman/engine/events";
import { BrowserConfiguration, BrowserInitOptionSpec } from "./configuration.js";
import { getStyleValue } from "./utils/getStyleValue.js";
/**
* Calls document.createElement for the specified node type and also applies
@ -205,6 +206,8 @@ export class UtilApiEndpoint {
this.domEventTracker.detachDOMEvent(Pelem as any, Peventname as any, Phandler, PuseCapture);
}
getStyleValue = getStyleValue;
shutdown() {
this.stylesheetManager?.unlinkAll();
this.domEventTracker?.shutdown();

View file

@ -30,7 +30,7 @@ let es5ClassAnnotationAsPurePlugin = {
}
}
const modules = ['kmwuitoggle', 'kmwuitoolbar'];
const modules = ['kmwuibutton', 'kmwuifloat', 'kmwuitoggle', 'kmwuitoolbar'];
for(let module of modules) {
await esbuild.build({

File diff suppressed because it is too large Load diff

File diff suppressed because it is too large Load diff

View file

@ -9,8 +9,8 @@
},
"extends": "../../tsconfig.base.json",
"files": [
// "kmwuibutton.ts",
// "kmwuifloat.ts",
"kmwuibutton.ts",
"kmwuifloat.ts",
"kmwuitoggle.ts",
"kmwuitoolbar.ts"
],

View file

@ -18,7 +18,7 @@ module.exports = function(config) {
// level of logging
// possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
// Can't set in base.conf.js b/c of constant's definition style.
// Can't set in base.conf.cjs b/c of constant's definition style.
logLevel: config.LOG_INFO
};

View file

@ -18,7 +18,7 @@ module.exports = function(config) {
// level of logging
// possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
// Can't set in base.conf.js b/c of constant's definition style.
// Can't set in base.conf.cjs b/c of constant's definition style.
logLevel: config.LOG_INFO
};

View file

@ -1,4 +1,4 @@
var BASE_CONFIG = require("./base.conf.js");
var BASE_CONFIG = require("./base.conf.cjs");
var ci_config_adapter = require("../../../../../common/test/resources/karma-browserstack-config.cjs");
module.exports = ci_config_adapter(BASE_CONFIG, "full");

View file

@ -73,60 +73,60 @@ Modernizr.on('touchevents', function(result) {
})
});
// describe('Basic Button UI', function() {
describe('Basic Button UI', function() {
// beforeEach(function() {
// this.timeout(testconfig.timeouts.uiLoad);
// fixture.setBase('fixtures');
// fixture.load('singleInput.html');
beforeEach(function() {
this.timeout(testconfig.timeouts.uiLoad);
fixture.setBase('fixtures');
fixture.load('singleInput.html');
// // Loads two scripts in parallel, but just in case, 2x timeout.
// return setupKMW('button', testconfig.timeouts.uiLoad);
// });
// Loads two scripts in parallel, but just in case, 2x timeout.
return setupKMW('button', testconfig.timeouts.uiLoad);
});
// afterEach(function() {
// fixture.cleanup();
// teardownKMW();
// });
afterEach(function() {
fixture.cleanup();
teardownKMW();
});
// it('The Button UI initializes correctly.', function() {
// assert(keyman.ui.init, 'Initialization flag is set to false!');
// })
// });
it('The Button UI initializes correctly.', function() {
assert(keyman.ui.init, 'Initialization flag is set to false!');
})
});
// describe('Basic Float UI', function() {
describe('Basic Float UI', function() {
// beforeEach(function() {
// this.timeout(testconfig.timeouts.uiLoad);
// fixture.setBase('fixtures');
// fixture.load('singleInput.html');
beforeEach(function() {
this.timeout(testconfig.timeouts.uiLoad);
fixture.setBase('fixtures');
fixture.load('singleInput.html');
// // Loads two scripts in parallel, but just in case, 2x timeout.
// return setupKMW('float', testconfig.timeouts.uiLoad);
// });
// Loads two scripts in parallel, but just in case, 2x timeout.
return setupKMW('float', testconfig.timeouts.uiLoad);
});
// afterEach(function() {
// fixture.cleanup();
// teardownKMW();
// });
afterEach(function() {
fixture.cleanup();
teardownKMW();
});
// it('The Float UI initializes correctly.', function() {
// assert(keyman.ui.initialized, 'Initialization flag is set to false!');
it('The Float UI initializes correctly.', function() {
assert(keyman.ui.initialized, 'Initialization flag is set to false!');
// assert.isNotNull(keyman.ui.outerDiv, 'Failed to create the floating controller element!');
assert.isNotNull(keyman.ui.outerDiv, 'Failed to create the floating controller element!');
// var divs = document.getElementsByTagName("div");
// var match = false;
var divs = document.getElementsByTagName("div");
var match = false;
// for(var i=0; i < divs.length; i++) {
// if(divs[i] == keyman.ui.outerDiv) {
// match = true;
// }
// }
for(var i=0; i < divs.length; i++) {
if(divs[i] == keyman.ui.outerDiv) {
match = true;
}
}
// assert(match, 'Floating controller element has not been added to the page!');
// })
// });
assert(match, 'Floating controller element has not been added to the page!');
})
});
describe('Basic Toolbar UI', function() {

View file

@ -18,7 +18,7 @@ module.exports = function(config) {
// level of logging
// possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
// Can't set in base.conf.js b/c of constant's definition style.
// Can't set in base.conf.cjs b/c of constant's definition style.
logLevel: config.LOG_INFO
};

View file

@ -23,7 +23,7 @@
</style>
<!-- Insert uncompiled KeymanWeb source scripts -->
<script src="../../../../../build/app/web/debug/keymanweb.js" type="application/javascript"></script>
<script src="../../../../../build/app/browser/debug/keymanweb.js" type="application/javascript"></script>
<!--
For desktop browsers, a script for the user interface must be inserted here.
@ -41,7 +41,8 @@
<script>
var kmw=window.keyman;
kmw.init({
attachType:'auto'
attachType:'auto',
resources:'../../resources'
}).then(function() {
loadKeyboards(1);
});

View file

@ -23,7 +23,7 @@
</style>
<!-- Insert uncompiled KeymanWeb source scripts -->
<script src="../../../../../build/app/web/debug/keymanweb.js" type="application/javascript"></script>
<script src="../../../../../build/app/browser/debug/keymanweb.js" type="application/javascript"></script>
<!--
For desktop browsers, a script for the user interface must be inserted here.
@ -41,7 +41,8 @@
<script>
var kmw=window.keyman;
kmw.init({
attachType:'auto'
attachType:'auto',
resources:'../../resources'
}).then(function() {
loadKeyboards(1);
});