fix(select): prevent click event from firing twice (#27570)

Issue number: N/A

---------

<!-- Please do not submit updates to dependencies unless it fixes an
issue. -->

<!-- Please try to limit your pull request to one type (bugfix, feature,
etc). Submit multiple pull requests if needed. -->

## What is the current behavior?
<!-- Please describe the current behavior that you are modifying. -->
The click event was firing twice.

## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->

- The click event fires once.

## Does this introduce a breaking change?

- [ ] Yes
- [x] No

<!-- If this introduces a breaking change, please describe the impact
and migration path for existing applications below. -->


## Other information

<!-- Any other information that is important to this PR such as
screenshots of how the component looks before and after the change. -->
You can use the test file to see that the event now fires once, and
before this change it fired twice. I couldn't figure out how to write an
automated test for this that fails before the change and passes after
the change. (Perhaps because of how Jest "clicks" elements? Not sure.)

Also, you can use the repro repo in the Jira ticket and update it to
`"@ionic/angular": "7.0.10-dev.11685472954.170be0cc",` and see that the
issue is fixed.

core/src/components/select/select.scss

@@ -224,6 +224,8 @@ button {
   cursor: inherit;
 
   box-sizing: border-box;
+
+  pointer-events: none;
 }
 
 .select-wrapper .select-placeholder {

core/src/components/select/test/basic/index.html

@@ -124,6 +124,19 @@
               <ion-select-option value="onions">Onions</ion-select-option>
             </ion-select>
           </ion-item>
+
+          <ion-item>
+            <ion-select
+              id="eventPropagation"
+              label="Stop Immediate Event Propagation"
+              placeholder="Select one"
+              interface="alert"
+            >
+              <ion-select-option value="apples">Apples</ion-select-option>
+              <ion-select-option value="oranges">Oranges</ion-select-option>
+              <ion-select-option value="pears">Pears</ion-select-option>
+            </ion-select>
+          </ion-item>
         </ion-list>
       </ion-content>
 
@@ -152,6 +165,11 @@
           message: '$1.50 charge for every topping',
         };
         customActionSheetSelect.interfaceOptions = customActionSheetOptions;
+
+        document.getElementById('eventPropagation').addEventListener('click', (evt) => {
+          evt.stopImmediatePropagation();
+          console.log('clicked');
+        });
       </script>
     </ion-app>
   </body>