Last active
October 8, 2020 13:20
-
-
Save jvkassi/8013dc3297e78d33fded6a52fb802c85 to your computer and use it in GitHub Desktop.
demo-aurelia-2
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html> | |
<head> | |
<meta charset="utf-8"> | |
<title>Dumber Gist</title> | |
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=no"> | |
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@0.9.1/css/bulma.min.css"> | |
<base href="/"> | |
</head> | |
<!-- | |
Dumber Gist uses dumber bundler, the default bundle file | |
is /dist/entry-bundle.js. | |
The starting module is pointed to "main" (data-main attribute on script) | |
which is your src/main.ts. | |
--> | |
<body> | |
<my-app></my-app> | |
<script src="/dist/entry-bundle.js" data-main="main"></script> | |
</body> | |
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
{ | |
"dependencies": { | |
"aurelia": "dev", | |
"bulma" : "latest" | |
} | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html> | |
<head> | |
<meta charset="utf-8"> | |
<title>Unit Tests</title> | |
<link rel="stylesheet" href="//cdn.jsdelivr.net/npm/jasmine-core@3/lib/jasmine-core/jasmine.min.css"> | |
</head> | |
<body> | |
<script src="//cdn.jsdelivr.net/npm/jasmine-core@3/lib/jasmine-core/jasmine.min.js"></script> | |
<script src="//cdn.jsdelivr.net/npm/jasmine-core@3/lib/jasmine-core/jasmine-html.min.js"></script> | |
<script src="//cdn.jsdelivr.net/npm/jasmine-core@3/lib/jasmine-core/boot.min.js"></script> | |
<script src="/dist/entry-bundle.js"></script> | |
<script> | |
requirejs([ | |
// Load test/setup if exists. | |
// or tests/setup, __test__/setup, __tests__/setup | |
// also matches files in any src/**/__test__ | |
/\/(tests?|__tests?__)\/setup$/, | |
// Load test/**/*.spec.js if exists. | |
// or tests/**/*.test.js, __test__/**/*.spec.js | |
// also matches files in any src/**/__test__ | |
/\.(spec|test)$/ | |
]); | |
</script> | |
</body> | |
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import Aurelia from 'aurelia'; | |
import { MyApp } from './my-app'; | |
Aurelia.app(MyApp).start(); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!-- | |
Try to create a paired css/scss/sass/less file like my-app.scss. | |
It will be automatically imported based on convention. | |
--> | |
<!-- | |
There is no bundler config you can change in Dumber Gist to | |
turn on shadow DOM. | |
But you can turn shadow DOM on by adding a meta tag in every | |
html template: | |
<use-shadow-dom> | |
--> | |
<h1>${message}</h1> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
export class MyApp { | |
public message: string = 'Hello Aurelia 2! cool !'; | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
body { | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import { render } from './helper'; | |
import { MyApp } from '../src/my-app'; | |
describe('Component App', () => { | |
it('should render message', async () => { | |
const div = await render('<my-app></my-app>', MyApp); | |
expect(div.textContent.trim()).toEqual('Hello Aurelia 2!'); | |
}); | |
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import Aurelia, { CustomElement } from 'aurelia'; | |
export async function render(template: string, ...deps: readonly unknown[]) { | |
const wrapper = CustomElement.define({name: 'wrapper', template}); | |
const div = document.createElement('div'); | |
const au = Aurelia.register(deps).app({ | |
host: div, | |
component: wrapper | |
}); | |
await au.start().wait(); | |
return div; | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment