From bcbb6e2ba33a68991ae9ba96685c7619eef4b9d3 Mon Sep 17 00:00:00 2001
From: YusukeIwaki <iwaki@i3-systems.com>
Date: Wed, 29 Jun 2022 09:57:29 +0900
Subject: [PATCH] fix: parse empty options in <select>

---
 lib/puppeteer/element_handle.rb | 29 +++++++++++++++++++--------
 spec/assets/input/select.html   |  1 +
 spec/integration/page_spec.rb   | 35 +++++++++++++--------------------
 3 files changed, 36 insertions(+), 29 deletions(-)
diff --git a/lib/puppeteer/element_handle.rb b/lib/puppeteer/element_handle.rb
index 7b687daa..597abae7 100644
--- a/lib/puppeteer/element_handle.rb
+++ b/lib/puppeteer/element_handle.rb
@@ -384,22 +384,35 @@ def select(*values)
     end
 
     fn = <<~JAVASCRIPT
-    (element, values) => {
+    (element, vals) => {
+      const values = new Set(vals);
       if (element.nodeName.toLowerCase() !== 'select') {
         throw new Error('Element is not a <select> element.');
       }
 
-      const options = Array.from(element.options);
-      element.value = undefined;
-      for (const option of options) {
-        option.selected = values.includes(option.value);
-        if (option.selected && !element.multiple) {
-          break;
+      const selectedValues = new Set();
+      if (!element.multiple) {
+        for (const option of element.options) {
+          option.selected = false;
+        }
+        for (const option of element.options) {
+          if (values.has(option.value)) {
+            option.selected = true;
+            selectedValues.add(option.value);
+            break;
+          }
+        }
+      } else {
+        for (const option of element.options) {
+          option.selected = values.has(option.value);
+          if (option.selected) {
+            selectedValues.add(option.value);
+          }
         }
       }
       element.dispatchEvent(new Event('input', { bubbles: true }));
       element.dispatchEvent(new Event('change', { bubbles: true }));
-      return options.filter(option => option.selected).map(option => option.value);
+      return [...selectedValues.values()];
     }
     JAVASCRIPT
     evaluate(fn, values)
diff --git a/spec/assets/input/select.html b/spec/assets/input/select.html
index 879a537a..026d48e3 100644
--- a/spec/assets/input/select.html
+++ b/spec/assets/input/select.html
@@ -5,6 +5,7 @@
   </head>
   <body>
     <select>
+      <option value="">Empty</option>
       <option value="black">Black</option>
       <option value="blue">Blue</option>
       <option value="brown">Brown</option>
diff --git a/spec/integration/page_spec.rb b/spec/integration/page_spec.rb
index fdb71fac..d45fb8eb 100644
--- a/spec/integration/page_spec.rb
+++ b/spec/integration/page_spec.rb
@@ -1455,13 +1455,11 @@ def check_metrics(page_metrics)
   #     );
   #     expect(result.length).toEqual(1);
   #   });
-  #   it('should return [] on no values', async () => {
-  #     const { page, server } = getTestState();
-
-  #     await page.goto(server.PREFIX + '/input/select.html');
-  #     const result = await page.select('select');
-  #     expect(result).toEqual([]);
-  #   });
+  it 'should return [] on no values', sinatra: true do
+    page.goto("#{server_prefix}/input/select.html")
+    result = page.select('select')
+    expect(result).to eq([])
+  end
   #   it('should deselect all options when passed no values for a multiple select', async () => {
   #     const { page, server } = getTestState();
 
@@ -1477,20 +1475,15 @@ def check_metrics(page_metrics)
   #       )
   #     ).toEqual(true);
   #   });
-  #   it('should deselect all options when passed no values for a select without multiple', async () => {
-  #     const { page, server } = getTestState();
-
-  #     await page.goto(server.PREFIX + '/input/select.html');
-  #     await page.select('select', 'blue', 'black', 'magenta');
-  #     await page.select('select');
-  #     expect(
-  #       await page.$eval('select', (select: HTMLSelectElement) =>
-  #         Array.from(select.options).every(
-  #           (option: HTMLOptionElement) => !option.selected
-  #         )
-  #       )
-  #     ).toEqual(true);
-  #   });
+  it 'should deselect all options when passed no values for a select without multiple', sinatra: true do
+    page.goto("#{server_prefix}/input/select.html")
+    page.select('select', 'blue', 'black', 'magenta')
+    page.select('select')
+    first_selected = page.eval_on_selector('select', <<~JAVASCRIPT)
+    (select) => Array.from(select.options).filter((option) => option.selected)[0].value
+    JAVASCRIPT
+    expect(first_selected).to eq('')
+  end
   #   it('should throw if passed in non-strings', async () => {
   #     const { page } = getTestState();
 
