true up

labapp/app/app.py

@@ -53,8 +53,10 @@ def cloudapp_fetch(url, timeout, prop, value, headers = {}):
     data = response.json()
     if data.get(prop) != value:
         raise ValueError(f"Invalid {prop}: expected {value}, got {data.get(prop)}")
-    clean_headers = headers_cleaner(data['request_headers'])
-    data['request_headers'] = clean_headers
+    if data.get("request_headers"):
+        clean_headers = headers_cleaner(data['request_headers'])
+        data['request_headers'] = clean_headers
+        return data
     return data
 
 def headers_cleaner(headers):
@@ -206,7 +208,7 @@ def ex_test():
         return jsonify(status='fail', error=str(e))
 
 @app.route('/_test2')
-def ex_test():
+def ex_test2():
     """Example test"""
     try:
         url = f"https://bar.{app.config['base_url']}/"

labapp/app/markdown/overview.md

@@ -6,7 +6,8 @@
 
 <div href="/" class="d-flex align-items-center pb-3 mb-3 link-dark text-decoration-none border-bottom"></div>
 
-The lab environment, it's apps, and method of interaction are intentionally simple in an attempt to streamline...
+The lab environment, the application endpoints, and how you interact with the load balancer have been simplified in an effort to focus on concepts.
+Understanding the environment, it's topology, and the rudimentary functionality of the <strong><a href="https://github.com/f5devcentral/f5xc-lab-mcn-practical/tree/main/cloudapp" target="_blank">cloud app</a></strong> will help in completing the exercises.
 
 <div style="height:25px"></div>
 
@@ -37,21 +38,38 @@ The lab environment contains three distributed sites meshed using the F5 Distrib
 
 ## **Cloud App**
 
-An instance of the [cloud app](https://github.com/f5devcentral/f5xc-lab-mcn-practical/tree/main/cloudapp) is hosted in each cloud site.
-The [cloud app](https://github.com/f5devcentral/f5xc-lab-mcn-practical/tree/main/cloudapp) is a simple application that echoes back an HTTP request.
-Remember while working through the lab, unless otherwise noted, the tests are displaying the headers and info **from the request received by the app**.
+An instance of the <strong><a href="https://github.com/f5devcentral/f5xc-lab-mcn-practical/tree/main/cloudapp" target="_blank">cloud app</a></strong> is hosted in each remote cloud environment.
+The cloud app is a simple application that echoes back an HTTP request.
+While working through the lab, unless otherwise noted, the test results are displaying the headers and info **from the request received by the app**.
+
+For testing, you can access an endpoint of each cloud app from your browser.
+
+<p float="left">
+<a href="https://aws-cloud-app.mcn-lab.f5demos.com/pretty" target="_blank">
+<img src="/static/aws.png" height="100px" width="auto" class="rounded"/>
+</a>
+<a href="https://azure-cloud-app.mcn-lab.f5demos.com/pretty" target="_blank">
+<img src="/static/azure.png" height="100px" width="auto" class="rounded"/>
+</a>
+</p>
+
+
 
 <div style="height:25px"></div>
 
 ## **Lab Exercises**
 
-To complete the lab exercises, you will interact with a load balancer advertised from the Customer Edge in your UDF site.
-All requests will be made from this lab application.
+Lab exercises will ask you to create configuration in the <strong><a href="https://f5-xc-lab-mcn.console.ves.volterra.io/" target="_blank">lab tenant</a></strong>.
+To complete a lab exercise, you will run a test against the load balancer advertised from the Customer Edge in your UDF site.
+Tests are integrated in this lab app.
 
+<div style="height:25px"></div>
 
 #### **Test Criteria**
 
-Exercises will specify thier success criteria.
+Exercises will specify thier success criteria along with the test.
+
+Here are some examples to try. 
 
 ```http
 GET https://foo.f5demos.com/ HTTP/1.1
@@ -61,32 +79,59 @@ GET https://foo.f5demos.com/ HTTP/1.1
 }
 ```
 
-In this example, the exercise's test will make a request to <strong>https://foo.f5demos.com</strong>.
-The test will succeed if the response contains the ``JSON`` response ``{ "info": "bar" }``.
-
-Here's an example test to try.
-
 <div class="left-aligned-button-container">
-    <button id="requestBtn1" class="btn btn-primary">Example Test</button>
+    <button id="requestBtn1" class="btn btn-primary">👍 Test</button>
 </div>
 <div id="result1" class="mt-3"></div>
 <script>
 document.getElementById('requestBtn1').addEventListener('click', () => {
-    makeHttpRequest('requestBtn1', '/_test', 'result1');
+    makeHttpRequest('requestBtn1', '/_test1', 'result1');
 });
 </script>
 
+The test made a request to <strong>https://foo.f5demos.com</strong>.
+The test succeeded because the response contained the ``JSON`` string ``{ "info": "bar" }``.
+
+<div style="height:25px"></div>
+
+```http
+GET https://bar.f5demos.com/ HTTP/1.1
+
+{
+  "info": "foo"
+}
+```
+
+<div class="left-aligned-button-container">
+    <button id="requestBtn2" class="btn btn-primary">👎 Test</button>
+</div>
+<div id="result2" class="mt-3"></div>
+<script>
+document.getElementById('requestBtn2').addEventListener('click', () => {
+    makeHttpRequest('requestBtn2', '/_test2', 'result2');
+});
+</script>
+
+The test made a request to <strong>https://bar.f5demos.com</strong>.
+The test failed because the response did not contain the ``JSON`` string ``{ "info": "bar" }``.
+
+
+<div style="height:25px"></div>
+
 #### **Other Tools**
 
 ``curl`` and ``jq`` are provided on the UDF "Runner" instance.
 
-<img src="/static/curl.png" width="400px" height="auto" alt="curl">
+```shell
+ubuntu@ubuntu:~$ curl -s https://foo.mcn-lab.f5demos.com/ | jq
+{
+  "info": "bar"
+}
+```
 
 
 Note that responses displayed in exercise tests are truncated for readibility.
 
-
-
 <div href="/" class="d-flex align-items-center pb-3 mb-3 link-dark text-decoration-none border-bottom"></div>
 
 Next, visit the <strong><a href="/setup" >setup page</a></strong> before starting the exercises.

labapp/app/markdown/welcome.md

@@ -15,18 +15,18 @@ Once configured, you'll be asked to **test** your configuration using this web a
 
 ## **Getting Started**
 
-When your UDF deployment launched, two automated processes started - Customer Edge ("CE") registration and account provisioning in the [lab tenant](https://f5-xc-lab-mcn.console.ves.volterra.io/).
+When your UDF deployment launched, two automated processes started - Customer Edge ("CE") registration and account provisioning in the <strong><a href="https://f5-xc-lab-mcn.console.ves.volterra.io/" target="_blank">lab tenant</a></strong>.
 
 <div style="height:25px"></div>
 
 ### **Customer Edge**
 
-The CE in the UDF deployment will registered with the [lab tenant](https://f5-xc-lab-mcn.console.ves.volterra.io/).
+The CE in the UDF deployment will registered with the <strong><a href="https://f5-xc-lab-mcn.console.ves.volterra.io/" target="_blank">lab tenant</a></strong>.
 CEs on first launch update software and, often, their OS. This can be very time consuming ~20 min from when the CE is booted.
-You can still get started on some preliminary tasks while waiting. 
 
 This lab app includes an indicator of the CE's status along with the site name in the navigation pane.
-The **site name** is needed when configuring the load balancer advertise policy. 
+The **site name** is needed when configuring the load balancer advertise policy.
+
 
 <div style="height:25px"></div>
 
@@ -42,9 +42,31 @@ Update your password and log into the tenant.
 </a>
 </p>
 
-<div class="alert alert-danger" role="alert">
-After logging in to the tenant you <strong>must</strong> visit the <strong><a href="/setup" class="alert-link">setup page</a></strong> before starting the exercises.
-</div>
+<div style="height:25px"></div>
+
+### **While You Wait**
+
+Here's a few things you can do while waiting for the CE to be registered and provisioned:
+
+<ul class="list-group">
+  <li class="list-group-item">
+    <i class="bi bi-envelope-exclamation"></i>&nbsp; &nbsp;
+    Check for the tenant "welcome" email.
+  </li>
+  <li class="list-group-item">
+    <i class="bi bi-book"></i>&nbsp; &nbsp;
+    Read the lab <strong><a href="/overview">overview</a></strong>.
+  </li>
+  <li class="list-group-item">
+    <i class="bi bi-gear"></i>&nbsp; &nbsp;
+    Configure lab <strong><a href="/settings">settings</a></strong> after logging into the tenant.
+  </li>
+  <li class="list-group-item">
+    <i class="bi bi-cup-hot"></i></i>&nbsp; &nbsp;
+    Get a cup of coffee.
+  </li>
+  </li>
+</ul>
 
 <div  style="height:25px" class="d-flex align-items-center pb-3 mb-3 link-dark text-decoration-none border-bottom"></div>
 

labapp/app/static/helpers.js

@@ -36,6 +36,6 @@ async function makeHttpRequest(buttonId, requestUrl, resultDivId) {
       resultDiv.innerHTML = `<div class="alert alert-danger">Error: ${error.message}</div>`;
   } finally {
       button.disabled = false;
-      resultDiv.scrollIntoView({ behavior: 'smooth', block: 'end' });
+      resultDiv.scrollIntoView({ behavior: 'smooth', block: 'nearest' });
   }
 }

labapp/app/templates/base.html

@@ -8,7 +8,8 @@
 
     <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
     <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>
-
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.min.css">
+
     <link rel="stylesheet" href="/static/dracula.css">
     <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/highlight.min.js"></script>
     <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/languages/http.min.js"></script>