RunestoneInteractive / RunestoneInteractive/rs

Runestone Issue: interactive overflow customization stopped working

Open
#1,157 2 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
TypeScript
Stars
69
Forks
117
Avg merge
6d 4h
Merged PRs (30d)
24

Description

Please check the current issues
I searched for "interactive" and "overflow" but no luck.

What Page were you on
https://author.runestone.academy/ns/books/published/iscam/investigation1-2.html?mode=browsing

Describe the bug
We have applets embedded in our pages via iframes, and some of these applets need to overflow the central column of the page. Previously this overflow was working when I styled the interactive tag with width=160% and aspect="3:2". Recently this stopped working and now applets in iframes have a truncated right side, with empty space to the right. I know this is a hack but it used to work and now it doesn't.

A Screenshot is worth a thousand words
We found a new hack but don't know how to implement it. If the interactive-iframe-container can be styled with "overflow: visible !important" then we get the prior (desired) behavior. But we don't know how to setup this style! We tried adding it "custom-styles.css" but it didn't carry through to published pages.

Current behavior (without interactive-iframe-container styling) - applet is truncated on right side:

Image

Desired behavior (with interactive-iframe-container styling added manually in developer console) - full width of applet is visible:

Image

Javascript Errors
tex-chtml.js:1 No version information available for component [tex]/newcommand
(anonymous) @ tex-chtml.js:1
Promise.then
c @ tex-chtml.js:1
t.load @ tex-chtml.js:1
(anonymous) @ tex-chtml.js:1
(anonymous) @ tex-chtml.js:1
(anonymous) @ tex-chtml.js:1
tex-chtml.js:1 No version information available for component [pretext]/mathjaxknowl3.js
(anonymous) @ tex-chtml.js:1
Promise.then
c @ tex-chtml.js:1
t.load @ tex-chtml.js:1
(anonymous) @ tex-chtml.js:1
(anonymous) @ tex-chtml.js:1
(anonymous) @ tex-chtml.js:1
console.js:19 sagecell.makeSagecell called
console.js:19 sagecell.makeSagecell finished
OneProp.htm?hideExtras=1:3731 Blocked autofocusing on a element in a cross-origin subframe.
investigation1-2.html?mode=browsing:90 in ready function
bookfuncs.js:473 Timezone cookie matches, not sending timezone to server
bookfuncs.js:507 This page served by undefined
bookfuncs.js:569 setup navbar for logged out
bookfuncs.js:595 triggering runestone:pre-login-complete
webpack.index.js:208 Runestone pre-login complete
webpack.index.js:189 Loading Runestone component: shortanswer
webpack.index.js:189 Loading Runestone component: multiplechoice
webpack.index.js:189 Loading Runestone component: answer
webpack.index.js:189 Loading Runestone component: feedback
webpack.index.js:189 Loading Runestone component: dragndrop
webpack.index.js:189 Loading Runestone component: fillintheblank
runestonebase.js:434 resolving checkServer with local data
runestonebase.js:434 resolving checkServer with local data
runestonebase.js:434 resolving checkServer with local data
runestonebase.js:434 resolving checkServer with local data
runestonebase.js:434 resolving checkServer with local data
runestonebase.js:434 resolving checkServer with local data
runestonebase.js:434 resolving checkServer with local data
runestonebase.js:434 resolving checkServer with local data
runestonebase.js:434 resolving checkServer with local data
runestonebase.js:434 resolving checkServer with local data
runestonebase.js:434 resolving checkServer with local data
runestonebase.js:434 resolving checkServer with local data
runestonebase.js:434 resolving checkServer with local data
runestonebase.js:434 resolving checkServer with local data
runestonebase.js:434 resolving checkServer with local data
runestonebase.js:434 resolving checkServer with local data
runestonebase.js:434 resolving checkServer with local data
runestonebase.js:434 resolving checkServer with local data
dragndrop.js:70 Populating DragNDrop with premises and responses
dragndrop.js:184 Replacing origElem with containerDiv
runestonebase.js:434 resolving checkServer with local data
fitb.js:777 Assertion failed: Error rendering Fill in the Blank Problem __I1.2b.6
Details: SyntaxError: Unexpected end of JSON input
(anonymous) @ fitb.js:777
(anonymous) @ fitb.js:766
(anonymous) @ webpack.index.js:202
Promise.then
h @ webpack.index.js:200
l @ jquery.min.js:2
c @ jquery.min.js:2
setTimeout
(anonymous) @ jquery.min.js:2
u @ jquery.min.js:2
fireWith @ jquery.min.js:2
fire @ jquery.min.js:2
u @ jquery.min.js:2
fireWith @ jquery.min.js:2
ready @ jquery.min.js:2
_ @ jquery.min.js:2
fitb.js:777 Assertion failed: Error rendering Fill in the Blank Problem __tech-detour-binomial-1-2b
Details: SyntaxError: Unexpected end of JSON input
(anonymous) @ fitb.js:777
(anonymous) @ fitb.js:766
(anonymous) @ webpack.index.js:202
Promise.then
h @ webpack.index.js:200
l @ jquery.min.js:2
c @ jquery.min.js:2
setTimeout
(anonymous) @ jquery.min.js:2
u @ jquery.min.js:2
fireWith @ jquery.min.js:2
fire @ jquery.min.js:2
u @ jquery.min.js:2
fireWith @ jquery.min.js:2
ready @ jquery.min.js:2
_ @ jquery.min.js:2
fitb.js:777 Assertion failed: Error rendering Fill in the Blank Problem __PP1.2bA.2
Details: SyntaxError: Unexpected end of JSON input
(anonymous) @ fitb.js:777
(anonymous) @ fitb.js:766
(anonymous) @ webpack.index.js:202
Promise.then
h @ webpack.index.js:200
l @ jquery.min.js:2
c @ jquery.min.js:2
setTimeout
(anonymous) @ jquery.min.js:2
u @ jquery.min.js:2
fireWith @ jquery.min.js:2
fire @ jquery.min.js:2
u @ jquery.min.js:2
fireWith @ jquery.min.js:2
ready @ jquery.min.js:2
_ @ jquery.min.js:2
runestonebase.js:434 resolving checkServer with local data
runestonebase.js:434 resolving checkServer with local data
runestonebase.js:434 resolving checkServer with local data
runestonebase.js:434 resolving checkServer with local data
runestonebase.js:434 resolving checkServer with local data
runestonebase.js:678 MathJax Ready -- dequeing a typesetting run for __I1.2b.1 undefined
runestonebase.js:678 MathJax Ready -- dequeing a typesetting run for __I1.2b.2 undefined
runestonebase.js:678 MathJax Ready -- dequeing a typesetting run for __I1.2b.5 undefined
runestonebase.js:678 MathJax Ready -- dequeing a typesetting run for __I1.2b.7 undefined
runestonebase.js:678 MathJax Ready -- dequeing a typesetting run for __I1.2b.13 undefined
runestonebase.js:678 MathJax Ready -- dequeing a typesetting run for __I1.2b.15 undefined
runestonebase.js:678 MathJax Ready -- dequeing a typesetting run for __I1.2b.16 undefined
runestonebase.js:678 MathJax Ready -- dequeing a typesetting run for __PP1.2bA.1 undefined
runestonebase.js:678 MathJax Ready -- dequeing a typesetting run for __PP1.2bA.3 undefined
runestonebase.js:678 MathJax Ready -- dequeing a typesetting run for __PP1.2bA.4 undefined
runestonebase.js:678 MathJax Ready -- dequeing a typesetting run for __PP1.2bB.1 undefined
runestonebase.js:678 MathJax Ready -- dequeing a typesetting run for __PP1.2bB.2 undefined
runestonebase.js:678 MathJax Ready -- dequeing a typesetting run for __PP1.2bB.3 undefined
runestonebase.js:678 MathJax Ready -- dequeing a typesetting run for __PP1.2bB.4 undefined
runestonebase.js:678 MathJax Ready -- dequeing a typesetting run for __PP1.2bB.5 undefined
runestonebase.js:678 MathJax Ready -- dequeing a typesetting run for __I1.2b.2b undefined
runestonebase.js:678 MathJax Ready -- dequeing a typesetting run for __I1.2b.3 undefined
runestonebase.js:678 MathJax Ready -- dequeing a typesetting run for __I1.2b.9 undefined
runestonebase.js:678 MathJax Ready -- dequeing a typesetting run for __I1.2b.4 undefined
runestonebase.js:678 MathJax Ready -- dequeing a typesetting run for undefined
runestonebase.js:678 MathJax Ready -- dequeing a typesetting run for undefined
runestonebase.js:678 MathJax Ready -- dequeing a typesetting run for undefined
runestonebase.js:678 MathJax Ready -- dequeing a typesetting run for undefined
runestonebase.js:678 MathJax Ready -- dequeing a typesetting run for undefined
runestonebase.js:678 MathJax Ready -- dequeing a typesetting run for __I1.2b.4 undefined
pretext_add_on.js?x=1:192 adding video popouts
pretext_add_on.js?x=1:305 scrollWidth 15
pretext.js:50 setting up pretext
investigation1-2.html?mode=browsing:1 Uncaught (in promise) Error: A listener indicated an asynchronous response by returning true, but the message channel closed before a response was received
investigation1-2.html?mode=browsing:1 Uncaught (in promise) Error: A listener indicated an asynchronous response by returning true, but the message channel closed before a response was received
investigation1-2.html?mode=browsing:1 Uncaught (in promise) Error: A listener indicated an asynchronous response by returning true, but the message channel closed before a response was received
investigation1-2.html?mode=browsing:1 Uncaught (in promise) Error: A listener indicated an asynchronous response by returning true, but the message channel closed before a response was received
investigation1-2.html?mode=browsing:1 Uncaught (in promise) Error: A listener indicated an asynchronous response by returning true, but the message channel closed before a response was received
investigation1-2.html?mode=browsing:1 Uncaught (in promise) Error: A listener indicated an asynchronous response by returning true, but the message channel closed before a response was received
investigation1-2.html?mode=browsing:1 Uncaught (in promise) Error: A listener indicated an asynchronous response by returning true, but the message channel closed before a response was received

What is your username
iambethchance

If you do not take the time to fill in this template we will treat this as very low priority.
Done!

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with custom-styles.css and the published page's interactive-iframe-container styling; compare the live page with the developer-console overflow override. Check how custom styles reach published pages and verify that the applet's right side is no longer truncated while the existing interactive behavior remains intact.

Written by the indexing model from the issue text.

Assessment

Tech stack
css, javascript
Domain
frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.