From f375baa9383f25fa94c1b94e68da36868e99045b Mon Sep 17 00:00:00 2001
From: Scott Jehl <scottjehl@users.noreply.github.com>
Date: Tue, 4 Oct 2022 19:13:11 -0400
Subject: [PATCH 1/4] css changes for #2406

---
 www/assets/css/pagestyle2.css | 34 +++++++++++++++++++++++++++++++++-
 1 file changed, 33 insertions(+), 1 deletion(-)

diff --git a/www/assets/css/pagestyle2.css b/www/assets/css/pagestyle2.css
index 101a08d7d3..5655f05b1b 100644
--- a/www/assets/css/pagestyle2.css
+++ b/www/assets/css/pagestyle2.css
@@ -1090,6 +1090,13 @@ h4.experiments_list_hed-recs {
   margin: 0;
 }
 
+.experiment_description_go-multi
+  label.experiment_pair_check:not(:has(input:checked))
+  + label:not(.experiment_pair_value-add) {
+  height: 3em;
+  overflow: hidden;
+}
+
 .experiment_description_go > label.experiment_pair_value {
   border-left: 0;
   margin-left: 0;
@@ -1104,6 +1111,7 @@ h4.experiments_list_hed-recs {
   overflow: hidden;
   text-indent: -999px;
   display: inline-block;
+  position: absolute;
 }
 
 .experiment_pair_value_addbtn {
@@ -1135,11 +1143,14 @@ h4.experiments_list_hed-recs {
 .experiment_description_go > label.experiment_pair_value-visible span {
   font-weight: 500;
   text-transform: initial;
+  position: relative;
+  max-width: 50%;
 }
 
 .experiment_description_go > label.experiment_pair_value-visible span em {
   font-size: 0.8em;
   color: #222;
+  display: block;
 }
 
 .experiment_description_go
@@ -1149,7 +1160,8 @@ h4.experiments_list_hed-recs {
   flex: 1 1 auto;
 }
 
-.experiment_description_go > label.experiment_pair_value input {
+.experiment_description_go > label.experiment_pair_value input,
+.experiment_description_go > label.experiment_pair_value textarea {
   width: 14em;
   margin: 0;
   padding: 1.45em;
@@ -1159,6 +1171,26 @@ h4.experiments_list_hed-recs {
   line-height: 1;
 }
 
+.experiment_description_go > label.experiment_pair_value textarea {
+  width: calc(100% - 4em);
+  display: block;
+  box-sizing: border-box;
+  margin: 0 1em 1em 3em;
+  padding: 1em;
+  height: 10em;
+  border: 0;
+  max-width: none;
+  line-height: 1.6;
+  white-space: nowrap;
+  overflow: auto;
+}
+
+.experiment_description_go > label.experiment_pair_value textarea:focus {
+  outline: none;
+  background: #fafafa;
+  border: 1px solid #ccc;
+}
+
 .experiments_foot {
   display: flex;
   justify-content: flex-end;

From 99c09e92c49bfc05b9c5f46fe40a63e7223b77a6 Mon Sep 17 00:00:00 2001
From: Scott Jehl <scottjehl@users.noreply.github.com>
Date: Tue, 4 Oct 2022 19:14:00 -0400
Subject: [PATCH 2/4] chore(format)

---
 www/assets/css/pagestyle2.css | 4 +---
 1 file changed, 1 insertion(+), 3 deletions(-)

diff --git a/www/assets/css/pagestyle2.css b/www/assets/css/pagestyle2.css
index 5655f05b1b..c9aff84bc7 100644
--- a/www/assets/css/pagestyle2.css
+++ b/www/assets/css/pagestyle2.css
@@ -1090,9 +1090,7 @@ h4.experiments_list_hed-recs {
   margin: 0;
 }
 
-.experiment_description_go-multi
-  label.experiment_pair_check:not(:has(input:checked))
-  + label:not(.experiment_pair_value-add) {
+.experiment_description_go-multi label.experiment_pair_check:not(:has(input:checked)) + label:not(.experiment_pair_value-add) {
   height: 3em;
   overflow: hidden;
 }

From e8198ea1e3dded4ca658a186714ba6650db0cdef Mon Sep 17 00:00:00 2001
From: Scott Jehl <scottjehl@users.noreply.github.com>
Date: Tue, 4 Oct 2022 19:15:07 -0400
Subject: [PATCH 3/4] experiments page edits for #2406

---
 www/experiments.php | 11 ++++++-----
 1 file changed, 6 insertions(+), 5 deletions(-)

diff --git a/www/experiments.php b/www/experiments.php
index 6a7a3af4d2..510143fed4 100644
--- a/www/experiments.php
+++ b/www/experiments.php
@@ -325,14 +325,14 @@ function observationHTML($parts)
                                         $out .= <<<EOT
                                         </div>
                                         <div class="experiment_description_go experiment_description_go-multi">
-                                        <label class="experiment_pair_check"><input type="checkbox" name="recipes[]" value="{$expNum}-{$exp->expvar}">Run with:</label>
+                                        <label class="experiment_pair_check"><input type="checkbox" name="recipes[]" value="{$expNum}-{$exp->expvar}">Run this Experiment with:</label>
                                         EOT;
                                         $addmore = $exp->addmore ? ' experiment_pair_value-add' : '';
 
                                         foreach ($exp->expfields as $field) {
                                             if ($field->type === "text") {
                                                 $out .= <<<EOT
-                                                <label class="experiment_pair_value-visible {$addmore}"><span>{$field->label}: </span><input type="{$field->type}" name="{$expNum}-{$exp->expvar}[]"></label>
+                                                <label class="experiment_pair_value-visible {$addmore}"><span>{$field->label} </span><input type="{$field->type}" name="{$expNum}-{$exp->expvar}[]"></label>
                                                 EOT;
                                             } else {
                                                 $out .= <<<EOT
@@ -348,11 +348,12 @@ function observationHTML($parts)
                                     }
                                 } elseif ($exp->expvar && !$exp->expval && $textinput) {
                                     if ($experimentEnabled) {
+                                        $placeholderEncodedVal = htmlentities('<script src="https://example.com/test.js"></script>');
                                         $out .= <<<EOT
                                         </div>
-                                        <div class="experiment_description_go">
-                                        <label class="experiment_pair_check"><input type="checkbox" name="recipes[]" value="{$expNum}-{$exp->expvar}">Run with:</label>
-                                        <label class="experiment_pair_value"><span>Value: </span><input type="text" name="{$expNum}-{$exp->expvar}[]" placeholder="experiment value..."></label>
+                                        <div class="experiment_description_go experiment_description_go-multi">
+                                        <label class="experiment_pair_check"><input type="checkbox" name="recipes[]" value="{$expNum}-{$exp->expvar}">Run this Experiment with:</label>
+                                        <label class="experiment_pair_value"><span>Value: </span><textarea name="{$expNum}-{$exp->expvar}[]" placeholder="{$placeholderEncodedVal}"></textarea></label>
 
                                         </div>
                                         EOT;

From 7004c4851fbbb9bdaa088e542155aa1506fc501f Mon Sep 17 00:00:00 2001
From: Scott Jehl <scottjehl@users.noreply.github.com>
Date: Tue, 4 Oct 2022 19:18:32 -0400
Subject: [PATCH 4/4] instruction label update for #2406

---
 www/experiments/custom.inc | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/www/experiments/custom.inc b/www/experiments/custom.inc
index 4b0c96c7e5..0433c40719 100644
--- a/www/experiments/custom.inc
+++ b/www/experiments/custom.inc
@@ -3,7 +3,7 @@
 $category = "Custom";
 $assessment[$category]["opportunities"][] = array(
     "title" =>  "Add HTML to document",
-    "desc" =>  "These experiments allow you to add arbitrary html to a page, which can for example, enable to you test the impact of adding script tags.",
+    "desc" =>  "These experiments allow you to add arbitrary html to a page, which can for example, enable to you test the impact of adding scripts, 3rd-party tags, or resource hints.",
     "examples" =>  array(),
     "experiments" =>  array(
         (object) [