From e7cb3b9f8836360ff8ebf777bcff5ab0a049e073 Mon Sep 17 00:00:00 2001
From: Lehtinen Teemu <lehtint6@t31300-lr146.org.aalto.fi>
Date: Tue, 7 Jan 2020 15:45:52 +0200
Subject: [PATCH] Use postMessage in function call
---
content.js | 19 +++++++++++--------
1 file changed, 11 insertions(+), 8 deletions(-)
diff --git a/content.js b/content.js
index c49da8a..a2b3b16 100644
--- a/content.js
+++ b/content.js
@@ -57,7 +57,7 @@ let Content = {
change_color: {
instructions: "The blue area on left contains barely visible text. Your task is to use the browser inspector tool to locate the paragraph element <strong><p></strong> containing the barely visible text and then add a CSS property to apply another <strong>color</strong>. <em>Note that editing existing CSS rules does not grade the exercise.</em>",
- html: "<div class=\"acos-webdev-poi\"><p class=\"blue\">The quick brown fox jumps over the lazy dog's back.</p></div>",
+ html: "<div class=\"acos-webdev-poi\"><p class=\"blue\">The quick brown fox jumps over the lazy dog's back 1234567890</p></div>",
mutations: true,
points: function ($element, config, mutations) {
let $p = $element.find('.exercise p');
@@ -104,15 +104,18 @@ let Content = {
instructions: "This time the area on left does not have any visible content. However, this exercise defines a JavaScript function that can grant you points. Your task is to use the browser console to call the function like this: <code>giveMePoints();</code>",
html: "<div id=\"events\"></div>",
script: function giveMePoints() {
- document.getElementById('events').dispatchEvent(new Event('grade'));
+ window.parent.postMessage('grade');
},
- selector: "#events",
- events: "grade",
+ selector: "$window.parent",
+ events: "message",
points: function ($element, config, event) {
- return {
- points: 10,
- feedback: 'Congratulations!'
- };
+ if (event.originalEvent.data == 'grade') {
+ return {
+ points: 10,
+ feedback: 'Congratulations!'
+ };
+ }
+ return undefined;
},
maxPoints: 10,
title: "Console command",
--
GitLab