-
Notifications
You must be signed in to change notification settings - Fork 36
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Typescript) fix errors #202
base: main
Are you sure you want to change the base?
Changes from all commits
18ea310
91eb802
2b994e4
2b40fa0
f105406
11fd46e
617c335
4b0b47f
4a25a08
1081dfb
b4f4e98
b47a40a
8b53a0e
d0b3ee6
f3abdd4
4c95467
5c1be03
cdcc9e4
5838247
309b9f9
26b3f73
9ceaf34
44b374b
a1124a2
ed5e0cd
0392314
c9deeff
1324f71
a08a992
b978ee0
03c30f9
30d2de4
52d8568
446a470
b34e054
7c2dda1
aa4826a
9e380ad
3d3670b
262c21a
e555b8d
5541804
d9b4f96
86c1571
b30d474
871efb6
f79dc45
5691e2d
f9e455f
645393c
97d49de
f0dc912
e31a1c3
f32e418
42047c9
21df852
0eac0bb
2d7062f
57bc24d
7d4c442
b68fea7
e937c18
874514f
6a0bdc9
3608713
c78c758
5eaddd7
949fce4
da0e02e
b1f3b5a
b07e22a
052db22
2a212a5
09fff65
52dd5e8
fe10cdd
0539723
25a5623
47f1a95
f17d603
68c692a
e971a07
66b058b
77c7534
c54464b
4199362
6b65549
0be6364
599b59c
b1d53fa
4d070f3
8d660a6
4dd0c3e
70aedb2
8781b75
81a0f4b
c332264
374010f
9db040a
d077cee
e9c5bc2
36c3e87
2dd14b3
20a71df
2f61cbc
1d6ee1e
5325ed6
c8b3687
d9409a8
7fdeac4
c46b663
bafc2ee
3cb5653
349f964
e539dc9
0b78eb9
76784ff
34d6676
f7b97de
b395db2
d32f283
1687ffe
186f3db
3c2889b
3ddfe8a
aa514d0
aa5c0fb
9ea2eaf
f92a010
5386572
faf6e56
1cda6b0
7965be7
79c7f85
b8d6680
7757821
5e3deda
1f0fb42
c0bb24e
594efcd
1695010
3dfc00a
f39fb0b
15b27e7
550a3f5
3edbcb9
b6e4948
b806758
70d10e1
b1cb101
7d72037
9557972
795ea72
a3b89ea
6de9e96
9b2b587
59f4f4e
3db4b52
d2a9d01
b153f3c
cc6b36b
ab408be
7b649f3
a1807b9
067a46c
a91603d
3b55d6a
3202a5d
be57808
0c464c5
2127974
0682e9d
b240067
544572a
5196ab5
b9f0238
f3a3950
0e28005
b596be2
3756af4
49341b8
289dd4f
b10a721
e8a2c1a
6400abb
44868d3
d78868f
d486835
a0f6478
e51d20d
74e783d
3cedcfd
5b5c411
9f414cb
56eea9d
0e83f16
fffce59
6470a54
c48c110
a5756b4
21406d5
3daf3ca
b7b294b
8f92625
ce1f543
e391b71
83c2337
2127388
0238738
b7e9f99
2e14bc9
aee30b1
0dd2b7c
36d3650
4251b56
d3f04d7
201947f
5263172
d74cdb0
4f005ab
97cd855
9960425
195c2c7
80881ff
b7e24df
734627a
49c9f0b
80683fb
21c7978
7bff82a
d749194
16988c5
65a697b
489914c
b8e996f
b620b3a
fec5a16
695f9d1
2ec5641
956c6d5
9d7ffb3
56d6ada
b6bf565
87def81
08cd09e
e5378b7
c389803
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -33,4 +33,3 @@ jobs: | |
|
||
- name: Run tsc | ||
run: npx tsc | ||
continue-on-error: true |
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -26,4 +26,5 @@ coverage/ | |
*-debug.log | ||
*-error.log | ||
|
||
.vscode | ||
.vscode/extensions.json | ||
.vscode/settings.json |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,18 @@ | ||
{ | ||
// Use IntelliSense to learn about possible attributes. | ||
// Hover to view descriptions of existing attributes. | ||
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387 | ||
"version": "0.2.0", | ||
"configurations": [ | ||
{ | ||
"type": "chrome", | ||
"request": "attach", | ||
"name": "Attach to Karma-Chrome", | ||
"sourceMaps": true, | ||
// "restart": true, | ||
// "timeout":180000, | ||
"port": 9222, | ||
"webRoot": "${workspaceFolder}" | ||
} | ||
] | ||
} |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,85 +1,90 @@ | ||
|
||
# TKO (“Technical Knockout”) | ||
|
||
[](https://badge.fury.io/js/tko) | ||
[](https://badge.fury.io/js/@tko%2Fbuild.reference) | ||
[](https://gitter.im/knockout/tko?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge) | ||
[](https://circleci.com/gh/knockout/tko) | ||
[](https://coveralls.io/github/knockout/tko?branch=master) | ||
[](https://standardjs.com) | ||
|
||
[](https://github.com/knockout/tko/actions/workflows/run-tsc.yml) | ||
[](https://coveralls.io/github/knockout/tko?branch=master) | ||
[](https://circleci.com/gh/knockout/tko) | ||
<!-- [](https://saucelabs.com/u/tko) --> | ||
|
||
**TKO** houses the monorepo of [Knockout](https://github.com/knockout/knockout). | ||
TKO, or Technical Knockout, is a JavaScript web framework for data binding and templating. It is a fork of the original Knockout.js, which was created to enhance and modernize the framework while maintaining its core principles. TKO and Knockout implement the [MVVM pattern](http://en.wikipedia.org/wiki/Model_View_ViewModel) (a modern variant of MVC) as a zero-dependency and small sized library. TKO makes it easy to create rich, desktop-like user interfaces with JavaScript/Typescript and HTML. It uses *observers* to automatically keep your UI in sync with an underlying data model, along with a powerful and extensible set of *declarative bindings* to enable productive development. | ||
|
||
TKO aims to provide developers with a more robust, modular, and maintainable codebase in [Typescript](https://www.typescriptlang.org/), making it easier to build rich, responsive, and maintainable web applications. | ||
|
||
|
||
|
||
## Getting Started | ||
|
||
To install use one of the usual package managers e.g. | ||
|
||
- $ `yarn add @tko/build.reference` | ||
- $ `npm install @tko/build.reference` | ||
- $ `pnpm install @tko/build.reference` | ||
|
||
|
||
Over CDN | ||
|
||
- Reference Build: https://cdn.jsdelivr.net/npm/@tko/[email protected]/dist/build.reference.min.js | ||
- Reference Build: https://cdn.jsdelivr.net/npm/@tko/build.reference/dist/build.reference.min.js | ||
|
||
For more details, see | ||
|
||
* TKO - Documentation (https://tko.io) | ||
* Knockout - Documentation (http://knockoutjs.com/documentation/introduction.html) | ||
* Online examples at [http://knockoutjs.com/examples/](http://knockoutjs.com/examples/) | ||
* Stackoverflow https://stackoverflow.com/questions/tagged/knockout.js | ||
|
||
## Knockout Build | ||
|
||
The Knockout build has some backwards compatibility that is not in the reference build. See the build differences, here: https://tko.io/3to4 | ||
|
||
It's available as `@tko/build.knockout`, and over CDN: | ||
|
||
- Knockout Build https://cdn.jsdelivr.net/npm/@tko/build.knockout@4.0.0-alpha8/dist/build.knockout.min.js | ||
- Knockout Build https://cdn.jsdelivr.net/npm/@tko/build.knockout/dist/build.knockout.min.js | ||
|
||
### Using the Monorepo | ||
|
||
| Command | Effect | | ||
| ------- | ------ | | ||
| $ `git clone [email protected]:knockout/tko` | Clone the repository. | | ||
| $ `npm install -g yarn` | Ensure yarn is globally available | | ||
| $ `yarn` | Install local node packages and link tko modules | | ||
| $ `make` | **Currently TKO use a make file** | | ||
| $ `yarn test` | Run all tests. See below. | | ||
| $ `yarn watch` | Run all tests and watch for changes. See below. | | ||
| $ `yarn build` | Build tko\[.module\]\[.es6\]\[.min\].js files, where `.es6` version has not been transpiled | | ||
| $ `npm install` | Ensure that all packages available | | ||
| $ `make` | **Currently TKO use a make file** / no scripts at package.json | | ||
| $ `make test` | Run all tests with electron. See below. | | ||
| $ `make test-headless` | Run all tests with chromium. See below. | | ||
| $ `lerna publish` | Bump versions and publish to npm registry | | ||
|
||
Checkout `package.json => scripts` for more commands that can be executed with `yarn {command}`. | ||
Checkout the `Makefile` for more commands that can be executed with `make {command}`. | ||
|
||
In each individual `packages/*/` directory, you can also run (presuming `rollup` and `karma` are installed globally): | ||
In each individual `packages/*/` directory, you can also run: | ||
|
||
| Command | Effect | | ||
| --- | --- | | ||
| $ `karma COMMAND ../../karma.conf.js [--once]` | Test the local package, where COMMAND is e.g. `start` or `run` | | ||
| $ `rollup -c ../../rollup.config.js` | Build the package into the local `dist/` | | ||
|
||
#### Testing with `yarn test` and `yarn watch` | ||
|
||
### NEW | ||
### Testing | ||
|
||
Start tests with electron: `make test` | ||
|
||
Start tests with headless-chrome: `make test-headless` | ||
|
||
### OLD | ||
|
||
The `yarn test` and `yarn watch` commands can be used in the root directory, where it will run across all tests, or alternatively in any `packages/*/` directory to run tests | ||
specific to that package. | ||
The test setup has naturally grown and been ported from knockout.js. Some tests use Jasmine 1.3, newer ones use Mocha, Chai and Sinon. Karma is used as test runner rather as test pipeline | ||
|
||
Optional arguments to `yarn test` include: | ||
Other options: | ||
|
||
- `--sauce` — use Sauce Labs to test a variety of platforms; requires an account at Sauce Labs and `SAUCE_USERNAME` and `SAUCE_ACCESS_KEY` to be set in the environment. | ||
- `--noStartConnect` — Do not start a new Sauce Connect proxy instance for every | ||
test; requires that Sauce Connect be already running. | ||
- `make ci` — use Sauce Labs to test a variety of platforms; requires an account at Sauce Labs and `SAUCE_USERNAME` and `SAUCE_ACCESS_KEY` to be set in the environment. | ||
|
||
#### `visual.html` | ||
#### `visual.html` (possibly outdated) | ||
|
||
Note that running `karma` or `rollup` will create a `visual.html` file that shows the proportional size of imports into each package. | ||
Note that running `karma` will create a `visual.html` file that shows the proportional size of imports into each package. | ||
|
||
### Objectives | ||
## Objectives | ||
|
||
TKO aims to become a base for future versions of Knockout. The objectives include: | ||
|
||
- Modularization into ES6 and separate projects, with compilation using an ES6 compiler like [Rollup](http://rollupjs.org/). This solves several problems with Knockout, including: | ||
- Modularization into ES6 and separate projects, with compilation using an ES6 compiler like [Esbuild](https://esbuild.github.io/). This solves several problems with Knockout, including: | ||
- Some folks want to roll-their-own with e.g. removing components | ||
- Compilation is now with Closure compiler, which is actually transliterating – meaning the *debug* and *minified* versions have different code paths (mostly in the form of things exposed in *debug* being missing in the *minified* version) | ||
- The compilation of Knockout is just concatenation, leading to difficulties with maintainance, severance, and replacement | ||
|
@@ -90,6 +95,27 @@ TKO aims to become a base for future versions of Knockout. The objectives inclu | |
- What should be simple plugins (e.g. binding handlers or providers) are complex, including: | ||
- Built-ins have first-class access to quite a bit of good Knockout code, but plugins generally have second-class access and often have to duplicate Knockout internals | ||
- Quality plugins have lots of boilerplate for compilation, release, documentation, and testing | ||
- Type-safe with Typescript | ||
- CSP compliant | ||
- JSX/TSX support | ||
|
||
## Overview of the development stack | ||
|
||
- **make** -> Build tasks | ||
- **npm** -> Node Package Manager | ||
- **esbuild** -> ts/js compiler and bundler | ||
- **lerna** -> mono-repo build-chain | ||
|
||
--- | ||
|
||
- Test-Runner -> Karma | ||
- Test-Environment -> electron and headless-chrome | ||
- TDD/BDD-Frameworks -> | ||
- Jasmine 1.3 | ||
- Mocha + Chai | ||
- sinon (Mocks) | ||
- Testing-Cloud-Service -> sauce | ||
- standard -> Code-Style (outdated for typescript) | ||
|
||
## Some WSL tricks | ||
|
||
|
@@ -122,6 +148,6 @@ MIT license - [http://www.opensource.org/licenses/mit-license.php.](http://www.o | |
|
||
<div> | ||
<a href='http://browserstack.com'> | ||
<img height=150px src='https://p3.zdusercontent.com/attachment/1015988/gTNrZ9vPjL8ThUHOWP7ucklJi?token=eyJhbGciOiJkaXIiLCJlbmMiOiJBMTI4Q0JDLUhTMjU2In0..HkCKDttXKDSGFoV5uaMPQA.ha9NDy63mjLKFcyNeib70TCkqfY0dcwiFwDYpZ8s5h75o-e1_cLjPAHlOUEwvKAbfMUaa1XpOL5F9AQd_B4iyc6JbgvKoKBxxe12aaOdfWFccP7r9iQ2Os6myiqBpP79prDXqFPMSAkF8ybzhVqCnWzxmK-Wvkbav-DGPZm3oS2IPD9ueIvf46bggFsikQhf1pjS5fgmzo07yi9Cf5SzA8zIKAjKX1RKQeFXOhBwxRfh_5SbJprfEZMnKBnGuO_qzP2fsK3BvxbyBKpIEWFdnA.t10i3BbyEpGtFVgyGbvQfw' alt='Browser Stack' /> | ||
Browser Stack | ||
</a> | ||
<div> |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,73 @@ | ||
/// <reference types="jasmine" /> | ||
/// <reference types="jquery" /> | ||
|
||
//export {} allows redefining window module | ||
export { }; | ||
brianmhunt marked this conversation as resolved.
Show resolved
Hide resolved
|
||
|
||
declare global { | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. We generally want to be mindful of polluting the global namespace, so we will need to be careful to not distribute this, and not rely on types defined only here. There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. I agree to 100%. The best global.d.ts is an empty one. Some oldstyle global objects like jquery or required need to be currently declared. The Jasmine and Mocha problem is homemade, but removing Jasmine is a bigger task. For compatibility, some global knockout types remain here because refactoring leads to invasive changes. Changing the prototype chains of the TKO base classes to js/ts classes can be done in later steps, but it breaks some of the critical interfaces of knockoutjs. We had try that. I will reorganise some global declarations. There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Update: "Import type" was a game changer. I also found a solution to create an object using a function in TypeScript like JavaScript for 'subscribable'. Changing the prototype chain of the objects (classes) in @tko/observable is a different challenge. |
||
|
||
// Below just informs IDE and/or TS-compiler (it's set in `.js` file). | ||
interface Window { | ||
DEBUG: boolean | ||
amdRequire: any | ||
require: any | ||
jQuery: JQueryStatic | ||
innerShiv // TODO: For IE<9.. we could also remove it | ||
} | ||
|
||
//Jasmine and Mocha define duplicated functions, is a problem for the type system | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. 🤦 There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. That's how it works for now. Jasmine 1.3 is old and there aren't many tests in Mocha. Perhaps a facade that redirects Jasmine 1.3 to Mocha/Chai is a future solution. There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. yes, those or playwright.dev or bun.sh. They're pretty tightly tied to Jasmine right now, so it'd be an effort, but homogenizing the runner would help a lot. |
||
//This namespace merges the jasmine namespace to correct same tsc warnings | ||
namespace jasmine { | ||
|
||
function setNodeText(node, text: string): void | ||
var Spec: any; | ||
function getGlobal(): any; | ||
var updateInterval: number | ||
function resolve(promise: Promise<boolean>) | ||
function prepareTestNode() : HTMLElement | ||
function nodeText(node) | ||
var Clock: Clock | ||
function getEnv(): any; | ||
|
||
var FakeTimer: any | ||
var undefined: undefined | ||
var browserSupportsProtoAssignment: any | ||
var ieVersion: any | ||
|
||
var Matchers: Matchers | ||
|
||
interface Matchers<T> { | ||
toContainText(expected: string, ignoreSpaces: boolean): boolean | ||
toHaveOwnProperties(expectedProperties: any): boolean | ||
toHaveTexts(expectedTexts: any): boolean | ||
toHaveValues(expectedValues: any): boolean | ||
toHaveCheckedStates(expectedValues: any): boolean | ||
toThrowContaining(expected: any): boolean | ||
toEqualOneOf(expectedPossibilities: any): boolean | ||
toContainHtml(expectedHtml: any, postProcessCleanedHtml: any): boolean | ||
toHaveSelectedValues(expectedValues: any): boolean | ||
toContainHtml(expectedValues: any): boolean | ||
toHaveNodeTypes(expectedTypes: any): boolean | ||
toContainHtmlElementsAndText(expectedHtml: any): boolean | ||
} | ||
|
||
interface Clock { | ||
mockScheduler: any | ||
} | ||
|
||
interface Spy { | ||
reset(): any | ||
} | ||
} | ||
|
||
//Knockout Types https://github.com/knockout/knockout/blob/master/build/types/knockout.d.ts#L404 | ||
// Type definitions for Knockout | ||
// Project: http://knockoutjs.com | ||
// Definitions by: Maxime LUCE <https://github.com/SomaticIT>, Michael Best <https://github.com/mbest> | ||
|
||
// Treeshaked for TKO: Almost all type definitions are moved to the TKO source. | ||
|
||
interface SymbolConstructor { | ||
observable?: Symbol; | ||
} | ||
} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I think there's an equivalent with esbuild [1] if we wanted to re-enable this
[1] https://esbuild.github.io/analyze/
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
that's cool, I didn't know that before