Hello world
This commit is contained in:
commit
2dbd318bc6
|
@ -0,0 +1,2 @@
|
||||||
|
/node_modules/
|
||||||
|
/package-lock.json
|
|
@ -0,0 +1,9 @@
|
||||||
|
# Tribute Iframe Issue
|
||||||
|
|
||||||
|
How to run:
|
||||||
|
|
||||||
|
npm install
|
||||||
|
npm i -g http-server
|
||||||
|
http-server .
|
||||||
|
# Open link
|
||||||
|
# Follow on-screen instructions
|
|
@ -0,0 +1,18 @@
|
||||||
|
<!doctype html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<title>Tribute Iframe Issue</title>
|
||||||
|
<link rel="icon" href="data:,">
|
||||||
|
<link rel="stylesheet" href="/node_modules/tributejs/dist/tribute.css">
|
||||||
|
<script src="/node_modules/tributejs/dist/tribute.js" defer="true"></script>
|
||||||
|
<script src="/index.js" defer="true"></script>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<p>Type "@P" in the box below.</p>
|
||||||
|
<p>Expected behaviour: A popup is shown with a suggestion.</p>
|
||||||
|
<p>Actual behaviour: No popup is shown.</p>
|
||||||
|
<main>
|
||||||
|
<iframe src="subdoc.html"></iframe>
|
||||||
|
</main>
|
||||||
|
</body>
|
||||||
|
</HTML>
|
|
@ -0,0 +1,21 @@
|
||||||
|
const initTribute = (element) => {
|
||||||
|
const values = [
|
||||||
|
{key: 'Phil Heartman', value: 'pheartman'},
|
||||||
|
{key: 'Gordon Ramsey', value: 'gramsey'}
|
||||||
|
];
|
||||||
|
new Tribute({
|
||||||
|
values: values
|
||||||
|
}).attach(element);
|
||||||
|
};
|
||||||
|
|
||||||
|
const getSubdoc = () => document
|
||||||
|
.querySelector('iframe')
|
||||||
|
.contentDocument;
|
||||||
|
|
||||||
|
const init = () => {
|
||||||
|
initTribute(getSubdoc().querySelector('.editor'));
|
||||||
|
};
|
||||||
|
|
||||||
|
document
|
||||||
|
.querySelector('iframe')
|
||||||
|
.addEventListener('load', init);
|
|
@ -0,0 +1,9 @@
|
||||||
|
{
|
||||||
|
"dependencies": {
|
||||||
|
"tributejs": "^3.6.0"
|
||||||
|
},
|
||||||
|
"name": "Tribute Iframe Issue",
|
||||||
|
"version": "1.0.0",
|
||||||
|
"main": "index.js",
|
||||||
|
"license": "MIT"
|
||||||
|
}
|
|
@ -0,0 +1,8 @@
|
||||||
|
<!doctype html>
|
||||||
|
<html>
|
||||||
|
<body>
|
||||||
|
<main>
|
||||||
|
<section class="editor" contenteditable="true"></section>
|
||||||
|
</main>
|
||||||
|
</body>
|
||||||
|
</html>
|
Loading…
Reference in New Issue