diff --git a/runestone/showeval/README.md b/runestone/showeval/README.md
index 86026f3a9..f7e9187ef 100644
--- a/runestone/showeval/README.md
+++ b/runestone/showeval/README.md
@@ -1,7 +1,7 @@
 <h2>ShowEval</h2>
 
 ```html
-<div data-childcomponent="showeval" class="runestone explainer alert alert-warning">
+<div data-component="showeval" class="runestone explainer alert alert-warning">
     <button class="btn btn-success" id="showEval_0_nextStep">Forward</button>
     <button class="btn btn-default" id ="showEval_0_reset">Reset</button>
     <div class="evalCont" style="background-color: #FDFDFD;"> <br /></div>
diff --git a/runestone/showeval/js/showEval.js b/runestone/showeval/js/showEval.js
index 000786c67..ed07286a6 100644
--- a/runestone/showeval/js/showEval.js
+++ b/runestone/showeval/js/showEval.js
@@ -14,11 +14,12 @@ import "../css/showEval.css";
 
 var seList = [];
 
-export class ShowEval {
+export class ShowEval extends RunestoneBase {
     constructor(opts) {
+        super(opts);
         this.divid = opts.orig.id;
-        this.container = $(`#${this.divid}`);
-        this.container.addClass("showEval");
+        this.containerDiv = opts.orig;
+        this.containerDiv.classList.add("showEval");
         let steps = [];
         for (let s of opts.raw) {
             steps.push(s.replace(/\\/g, ""));
@@ -29,7 +30,7 @@ export class ShowEval {
         this.rb = new RunestoneBase(opts);
         // create elements
         this.currentStepDiv = $("<div>").addClass("currentStepDiv");
-        this.container.append(this.currentStepDiv);
+        $(this.containerDiv).append(this.currentStepDiv);
         this.currentStepDiv.append($("<span>").addClass("pre"));
         this.currentStepDiv.append($("<span>").addClass("eval"));
         this.currentStepDiv.append($("<span>").addClass("post"));
@@ -66,10 +67,9 @@ export class ShowEval {
             this.steps[i].push(comment); // 'anno'
         }
         this.reset();
-        this.rb.caption = "ShowEval";
-        this.rb.containerDiv = this.container[0].parentElement;
-        this.rb.divid = this.container[0].id;
-        this.rb.addCaption("runestone");
+        this.caption = "ShowEval";
+        this.addCaption("runestone");
+        this.indicate_component_ready();
     }
 
     setNextButton(nextButtonSelector) {
@@ -87,12 +87,12 @@ export class ShowEval {
     }
 
     reset() {
-        this.container.find(".previousStep").remove();
+        $(this.containerDiv).find(".previousStep").remove();
         this.setStep(0);
         this.rb.logBookEvent({
             event: "showeval",
             act: "reset",
-            div_id: this.container[0].id,
+            div_id: this.containerDiv.id,
         });
     }
 
@@ -197,7 +197,7 @@ export class ShowEval {
         this.rb.logBookEvent({
             event: "showeval",
             act: "next",
-            div_id: this.container[0].id,
+            div_id: this.containerDiv.id,
         });
     }
 }
@@ -207,7 +207,7 @@ export class ShowEval {
 ==   execute our code on them    ==
 =================================*/
 $(document).bind("runestone:login-complete", function () {
-    $("[data-childcomponent=showeval]").each(function (index) {
+    $("[data-component=showeval]").each(function (index) {
         // MC
         var opts = {
             orig: this,
diff --git a/runestone/showeval/showeval.py b/runestone/showeval/showeval.py
index 04589c998..a3644fc30 100644
--- a/runestone/showeval/showeval.py
+++ b/runestone/showeval/showeval.py
@@ -50,11 +50,11 @@ def depart_showeval_node(self, node):
 
 
 CODE = """
-<div data-childcomponent="showeval" data-question_label="%(question_label)s" class="%(divclass)s" id="%(divid)s" data-tracemode="%(trace_mode)s" %(optional)s>
+<div data-component="showeval" data-question_label="%(question_label)s" class="%(divclass)s" id="%(divid)s" data-tracemode="%(trace_mode)s" %(optional)s>
     <button class="btn btn-success" id="%(divid)s_nextStep">Next Step</button>
     <button class="btn btn-default" id ="%(divid)s_reset">Reset</button>
     <div class="evalCont" style="background-color: #FDFDFD;">%(preReqLines)s</div>
-    <div class="evalCont" id="%(divid)s"></div>
+    <div class="evalCont"></div>
     <script>
     if (typeof window.raw_steps === "undefined") {
     window.raw_steps = {};
diff --git a/runestone/showeval/test/test_showEval.py b/runestone/showeval/test/test_showEval.py
index f7c7af57d..1513feafc 100644
--- a/runestone/showeval/test/test_showEval.py
+++ b/runestone/showeval/test/test_showEval.py
@@ -1,83 +1,77 @@
 import time
-from runestone.unittest_base import module_fixture_maker, RunestoneTestCase
-from selenium.webdriver.support import expected_conditions as EC
-from selenium.webdriver.support.ui import WebDriverWait
-from selenium.webdriver.common.by import By
+import pytest
 
 __author__ = "wayne brown"
 
-mf, setUpModule, tearDownModule = module_fixture_maker(__file__, True)
 
+@pytest.fixture
+def selenium_utils_1(selenium_utils):
+    selenium_utils.get("trace.html")
+    selenium_utils.wait_until_ready("showEval_3")
+    return selenium_utils
 
-class ShowEvalTest_TraceMode(RunestoneTestCase):
-    def setUp(self):
-        super(ShowEvalTest_TraceMode, self).setUp()
-        print(vars(self))
-        self.driver.get(self.host + "/trace.html")
-        wait = WebDriverWait(self.driver, 10)
-        try:
-            wait.until(EC.presence_of_element_located((By.TAG_NAME, "body")))
-        except:
-            text = self.driver.page_source
-            print(text[:300])
 
-    def test_Next_Step(self):
-        driver = self.driver
-        self.assertIn("ShowEval", driver.title)
-        evalDiv = driver.find_element_by_id("showEval_3")
+def test_Next_Step_1(selenium_utils_1):
+    driver = selenium_utils_1.driver
+    assert "ShowEval" in driver.title
+    evalDiv = driver.find_element_by_id("showEval_3")
 
-        prevList = driver.find_elements_by_class_name("previousStep")
-        prevListLen = len(prevList)
-        assert prevListLen == 0
-        assert len(evalDiv.find_elements_by_tag_name("span")) == 3
+    prevList = driver.find_elements_by_class_name("previousStep")
+    prevListLen = len(prevList)
+    assert prevListLen == 0
+    assert len(evalDiv.find_elements_by_tag_name("span")) == 4
 
+    driver.find_element_by_id("showEval_3_nextStep").click()
+    time.sleep(3)
+    assert len(evalDiv.find_elements_by_tag_name("span")) == 4
+    assert len(driver.find_elements_by_class_name("previousStep")) > prevListLen
+
+
+def test_Reset_Step_1(selenium_utils_1):
+    driver = selenium_utils_1.driver
+    assert "ShowEval" in driver.title
+    evalDiv = driver.find_element_by_id("showEval_3")
+
+    for i in range(3):
         driver.find_element_by_id("showEval_3_nextStep").click()
         time.sleep(3)
-        assert len(evalDiv.find_elements_by_tag_name("span")) == 3
-        assert len(driver.find_elements_by_class_name("previousStep")) > prevListLen
 
-    def test_Reset_Step(self):
-        driver = self.driver
-        self.assertIn("ShowEval", driver.title)
-        evalDiv = driver.find_element_by_id("showEval_3")
+    assert len(evalDiv.find_elements_by_class_name("previousStep")) > 0
+    driver.find_element_by_id("showEval_3_reset").click()
+    assert len(evalDiv.find_elements_by_class_name("previousStep")) == 0
 
-        for i in range(3):
-            driver.find_element_by_id("showEval_3_nextStep").click()
-            time.sleep(3)
 
-        assert len(evalDiv.find_elements_by_class_name("previousStep")) > 0
-        driver.find_element_by_id("showEval_3_reset").click()
-        assert len(evalDiv.find_elements_by_class_name("previousStep")) == 0
+@pytest.fixture
+def selenium_utils_2(selenium_utils):
+    selenium_utils.get("replace.html")
+    selenium_utils.wait_until_ready("showEval_2")
+    return selenium_utils
 
 
-class ShowEvalTest_ReplaceMode(RunestoneTestCase):
-    def setUp(self):
-        super(ShowEvalTest_ReplaceMode, self).setUp()
-        self.driver.get(self.host + "/replace.html")
+def test_Next_Step_2(selenium_utils_2):
+    driver = selenium_utils_2.driver
+    assert "ShowEval" in driver.title
+    evalDiv = driver.find_element_by_id("showEval_2")
 
-    def test_Next_Step(self):
-        driver = self.driver
-        self.assertIn("ShowEval", driver.title)
-        evalDiv = driver.find_element_by_id("showEval_2")
+    assert len(evalDiv.find_elements_by_tag_name("span")) == 4
+    evalText = driver.find_element_by_class_name("eval").text
+    assert evalText != ""
 
-        assert len(evalDiv.find_elements_by_tag_name("span")) == 3
-        evalText = driver.find_element_by_class_name("eval").text
-        assert evalText != ""
+    driver.find_element_by_id("showEval_2_nextStep").click()
+    time.sleep(3)
+    assert len(evalDiv.find_elements_by_tag_name("span")) == 4
+    assert driver.find_element_by_class_name("eval").text != evalText
 
-        driver.find_element_by_id("showEval_2_nextStep").click()
-        time.sleep(3)
-        assert len(evalDiv.find_elements_by_tag_name("span")) == 3
-        assert driver.find_element_by_class_name("eval").text != evalText
 
-    def test_Reset_Step(self):
-        driver = self.driver
-        self.assertIn("ShowEval", driver.title)
-        evalText1 = driver.find_element_by_class_name("eval").text
+def test_Reset_Step_2(selenium_utils_2):
+    driver = selenium_utils_2.driver
+    assert "ShowEval" in driver.title
+    evalText1 = driver.find_element_by_class_name("eval").text
 
-        for i in range(4):
-            driver.find_element_by_id("showEval_2_nextStep").click()
-            time.sleep(3)
+    for i in range(4):
+        driver.find_element_by_id("showEval_2_nextStep").click()
+        time.sleep(3)
 
-        assert driver.find_element_by_class_name("eval").text != evalText1
-        driver.find_element_by_id("showEval_2_reset").click()
-        assert driver.find_element_by_class_name("eval").text == evalText1
+    assert driver.find_element_by_class_name("eval").text != evalText1
+    driver.find_element_by_id("showEval_2_reset").click()
+    assert driver.find_element_by_class_name("eval").text == evalText1