cognitive-engineering-lab / mdbook-quiz Goto Github PK
View Code? Open in Web Editor NEWInteractive quizzes for Markdown
Home Page: https://cognitive-engineering-lab.github.io/mdbook-quiz/
License: Apache License 2.0
Interactive quizzes for Markdown
Home Page: https://cognitive-engineering-lab.github.io/mdbook-quiz/
License: Apache License 2.0
Would be nice to go back and fix a previous answer. Needs to be configurable for cases like the Ownership Inventory.
It looks like if the question prompt ends in a code snippet, the bottom of the last line can get cut short. I've noticed this at several zoom levels, although it is most prominent at <100% zoom. I'm using Firefox version 112.0.2 on Linux. This is mostly a cosmetic issue, although when severe enough it can cause underscores on the last line to disappear entirely; see the attached photos.
Context: I used mdbook-quiz
to make quizzes for a course in python and I struggled a bit with the format of the prompt.prompt
for multiple choices question.
What I did: I first thought that you could enter any markdown as for the mdbook
. For some reason, this is not the case. As far as I understand, what was causing problem is my poor understanding of the rust parser. In the end, the prompt needs to be only one line and to include some code I did use the following syntax:
<pre><code class=\"language-python\"> ... </code></pre>
Not sure, this is the right way to do? More examples available at: https://github.com/dataflowr/quiz
A better solution would be that the prompt could be any markdown (i.e. like what is used as input for mdbook
) but I do not know if this is possible?
I did not try to make tracing question in python but this might be another nice example to add.
I am unable to install graco using npm. After running the (sudo) npm install -g graco command, I am getting the errors below.
I have noticed that quizzes created with mdbook-quiz
are displayed correctly when serving the mdbook
locally using mdbook serve
. However, when I generate static HTML files and access them from the book/index.html
file, the quizzes do not render.
Is there a workaround or specific configuration that would allow quizzes to be displayed and rendered correctly in the generated static HTML files?
mdbook-quiz.schema.json
is now part of the release, but I couldn't figure out VSCode integration...
Hi,
here is my pb (screenshot from https://dataflowr.github.io/quiz/python.html):
I noticed that in your example (live-demo), the rendering is fine:
So there is something I am doing wrong but I do not know what?
code (taken from https://github.com/dataflowr/quiz/blob/main/dl-quiz/src/quiz_01.toml):
[[questions]]
type = "Tracing"
prompt.program = """
def print_11():
x = 11
print(x)
def print_x_outside():
print(x)
x = 10
def main():
def print_x_inside():
print(x)
x = 11
print_11()
print_x_inside()
x = 12
print_x_outside()
print_11()
print_x_inside()
main()
"""
answer.doesCompile = true
answer.stdout = """
11
11
10
11
12"""
Thank you for your help.
This is more of a feature request, the current display always provides multiple choice answers in the same order, would it be possible to randomize the answers? Providing the right answer might then become challenging though, but a map could be used instead of an array for the answers?
mdbook
allows you to define draft chapter in your summary.
But currently if you have a draft chapter and we use mdbook-quiz
we panic because of this line https://github.com/willcrichton/mdbook-quiz/blob/main/src/processor.rs#L207
As a minimal reproduction case, we can simply use the example provided in this repository and add this line to SUMMARY.md :
# Summary
- [Chapter 1](./chapter_1.md)
- [Chapter 2]()
I think the simple fix would be doing only treat the case were the option is Some
using a if let Some
construct.
Hello @willcrichton,
sounds great!
Unfortunately I can't install Rust.
Is there a binary out there?
Thanks & greetings
rufus42
I've encountered an issue with the .mjs
file type while using mdbook quiz. When I open a page containing the quiz and test it through a server I get the following errors in different browsers:
Firefox:
Loading the module from
https://xxx/mdbook/quiz/quiz-embed.mjs
was blocked due to a disallowed MIME type.
Microsoft Edge:
Failed to load module script: Expected a JavaScript module script, but the server responded with a MIME type of "". Strict MIME type checking is enforced for module scripts per HTML spec.
To resolve this issue the server must serve the .mjs
file appropriately. However, when you don't have control over the server or are publishing files for public use, this can lead to problems (as I am here). Some tools may also not support the .mjs
extension.
A workaround to make the quiz-embed.mjs
module work is to append .js
to the end of .mjs
files, like quiz-embed.mjs.js
. This is accepted but it requires manual replacement of all artifacts in the generated code.
Is there a reason for using the .mjs
file extension?
If it was for module clarity, preferred over .js
, one could use .mjs
during development and convert to .js
during the build step. However, ensure that changing to a .js
file does not introduce additional issues. Currently this workaround is working for me without any issues.
The quiz styling doesn't play nice with the bug reporting pop-up; in particular the close button is styled to be nearly invisible in the navy and coal themes. This is particularly important because the navy theme is the default. See attached screenshot:
This is caused is the combination of two conflicting style rules, found in index.scss
.
The first style rule removes the background for the selector .mdbook-quiz .prompt .bug-report button
-- that's a selector with 3 classes and 1 element; so a CSS specificity weight of 0.3.1. Presumably this is done to make the background go away on the close button, though technically it could apply to other buttons on the bug report form that use the <button>
element.
mdbook-quiz/js/packages/quiz-embed/src/index.scss
Lines 164 to 168 in fd43ab7
The second style rule puts the background back in, and also sets the foreground color. It applies to the selectors .mdbook-quiz button
and .mdbook-quiz input[type=submit]
-- only the first of which is important here. It has one class plus one element, so a specificity of 0.1.1. That means it between the two rules mentioned, this one loses and gets overridden by one previously mentioned.
mdbook-quiz/js/packages/quiz-embed/src/index.scss
Lines 128 to 136 in fd43ab7
Therefore the close button is using the button foreground color (technically --searchbar-fg
) and the background color of the body (instead of --searchbar-bg
). And in two of the themes (including the default), the button text color isn't readable on the body background color.
Note that the submit button isn't affected by this error because it's an <input type="submit"/>
rather than <button>
.
My recommendation would be to add color: var(--fg);
to the first selector.
Though, do note that you already have a selector for just the close button on line 180; perhaps you want to do all of the styling for the close button in that rule?
Is there any way to configure the language for default strings, like "Question", "Response", "Determine whether .. program if it were executed." etc.?
I'm writing a mdbook-quiz in Dutch. Upon building the mdbook I get errors in spelling. I see that I can add a custom .dic, but for now I'd prefer to switch this off. Is there a setting for the book.toml
like for instance spelling-check = false
which I can add below the [preprocessor.quiz]
?
Another issue is that the quiz question block is NOT shown at all in the rendered website. But that could be due to some custom styling or something. I AM missing a short log line like from the quiz preprocessor starting in the pipeline, which OTHER mdbook preprocessors, like the mdbook-linkcheck DOo emit.
In the end inally I found that there is a placeholder
main
branch to see if this has already been fixedURL to the section(s) of the book with this problem:
https://rust-book.cs.brown.edu/
Description of the problem:
If the user presses on the left or right arrow keys while writing the text in the bug form, the current page changes and the form is lost. It happened to me several times and it's a waste of time; this happens easily when the user needs to move the cursor to add or change text.
The keys are captured by the left menu system rather than the form.
Suggested fix:
Make the form capture all the keys when it has the focus.
Would be nice to have an option to see all choices after completing a quiz question and not only the correct answer at the end of a quiz.
Currently finished chapter 4.2 References & Borrowing and this came up after the last question of the last quiz, which I had some trouble on.
Thanks, and I appreciate the work going into this project.
Currently, you can only choose one possible solution as the answer, would it be possible to support the selection of multiple choices as the answer?
I'm having this waning log:
Could not find the language 'cpp', did you forget to load/include a language module? [lib.js:152:25938](http://localhost:3000/quiz/lib.js)
Falling back to no-highlight mode for this block.
<code class="language-cpp">
[lib.js:152:25973](http://localhost:3000/quiz/lib.js)
My question:
[[questions]]
type = "MultipleChoice"
prompt.prompt = """
```cpp
int x = 0;
```
"""
I have the same error with python too.
I think it is because the code only imports rust:
And indeed for rust the highlight is working
Thanks for your work. I've noticed that the quiz doesn't show up when we put a code block at the end of the file (with no blanket line after).
For instance, if we add this line to chapter_1.md of the example of this repository:
println("hello world");
I can't show the full content of the file because it won't display well on this issue, but you can find a repository that reproduces the bug here.
main
branch to see if this has already been fixedDescription of the problem:
When the user answers a quiz it returns them to the top of the page and result is not visible. The user has to scroll in order to see the result
Checked on MacOS 12.6.2, Firefox 109 and Chrome 109
Suggested fix:
A learner would expect to see the quiz result on submitting the response.
Return URL should anchor to the quiz box or quiz question/response should not navigate away.
e.g. TOML parsing failure
People are conflating the "this is YOUR answer" with "this is the ACTUAL answer". Idea: show a blurry or "?" panel that indicates that the real answer is hidden away.
main
branch to see if this has already been fixedURL to the section(s) of the book with this problem:
Description of the problem:
It took me a few seconds to figure out how to close the bug report pop-up. It's not obvious that I need to click the bug icon again to close the pop-up box.
Suggested fix:
Other websites I've seen allow the user to click anywhere outside of a pop-up to cancel it. Or have a close (X) button on the dialog itself.
I'm trying to use the quizz inside my mdbook
but sadly I'm panicking at this line:
https://github.com/willcrichton/mdbook-quiz/blob/main/src/processor.rs#L207
I think maybe we could have some context to the error, for instance the variable chapter
to make it easier to debug.
Description:
It would be nice to have a feature that allows users to make the "See the Correct Answers" button optional in the quiz configuration. Currently, this button appears automatically when a user answers some questions incorrectly. However, in certain use cases, we may want to hide this button to encourage learners to attempt the quiz without immediately seeing the correct answers.
Proposed Solution:
To implement this feature, a configuration variable must be added to the quiz configuration file. This variable, let's call it show-correct-answers
, can be set to true
or false
. When set to true
, the button behaves as it does currently, appearing when a user answers questions incorrectly. When set to false
, the button is hidden, and users can only review their answers without seeing the correct ones, while keeping the "retry the quiz" button always visible.
Example Usage:
<!-- Quiz Configuration -->
show-correct-answers`: false
Currently if we put a quiz in a nested folder, that doesn't seem to work.
I've created a minimal example here: https://github.com/Tudyx/mdbookquiz-nested-folder
That's already super great to have quiz in flat book but it is planned to add support for nested one in the future?
I think it will be a good use case because the mdbook doc is kind of encouraging to have a nested structure.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.