Fix form submission with type "button" (cypress-io#2278)

kuceb · brian-mann · commit e46edab964c9 · 2018-08-06T04:33:59.000-04:00
* gets type from button

* remove extra whitespace

* update tests broken by changing dom.html
diff --git a/packages/driver/src/cy/commands/actions/type.coffee b/packages/driver/src/cy/commands/actions/type.coffee
@@ -84,10 +84,10 @@ module.exports = (Commands, Cypress, cy, state, config) ->
 
       isBody      = options.$el.is("body")
       isTextLike  = $dom.isTextLike(options.$el)
-      isDate      = $dom.isInputType(options.$el, "date")
-      isTime      = $dom.isInputType(options.$el, "time")
-      isMonth     = $dom.isInputType(options.$el, "month")
-      isWeek      = $dom.isInputType(options.$el, "week")
+      isDate      = $dom.isType(options.$el, "date")
+      isTime      = $dom.isType(options.$el, "time")
+      isMonth     = $dom.isType(options.$el, "month")
+      isWeek      = $dom.isType(options.$el, "week")
       hasTabIndex = $dom.isSelector(options.$el, "[tabindex]")
 
       ## TODO: tabindex can't be -1
@@ -161,8 +161,8 @@ module.exports = (Commands, Cypress, cy, state, config) ->
       getDefaultButtons = (form) ->
         form.find("input, button").filter (__, el) ->
           $el = $(el)
-          ($dom.isSelector($el, "input") and $dom.isInputType($el, "submit")) or
-          ($dom.isSelector($el, "button") and not $dom.isInputType($el, "button"))
+          ($dom.isSelector($el, "input") and $dom.isType($el, "submit")) or
+          ($dom.isSelector($el, "button") and not $dom.isType($el, "button"))
 
       type = ->
         simulateSubmitHandler = ->
diff --git a/packages/driver/src/cypress/keyboard.coffee b/packages/driver/src/cypress/keyboard.coffee
@@ -403,7 +403,7 @@ $Keyboard = {
     @ensureKey el, key, options, ->
 
       isDigit = isSingleDigitRe.test(key)
-      isNumberInputType = $elements.isInput(el) and $elements.isInputType(el, 'number')
+      isNumberInputType = $elements.isInput(el) and $elements.isType(el, 'number')
 
       if isNumberInputType
         selectionStart = el.selectionStart
diff --git a/packages/driver/src/dom/elements.coffee b/packages/driver/src/dom/elements.coffee
@@ -27,6 +27,8 @@ _getValue = ->
       descriptor("HTMLTextAreaElement", "value").get
     when isSelect(this)
       descriptor("HTMLSelectElement", "value").get
+    when isButton(this)
+      descriptor("HTMLButtonElement", "value").get
     else
       ## is an option element
       descriptor("HTMLOptionElement", "value").get
@@ -39,6 +41,8 @@ _setValue = ->
       descriptor("HTMLTextAreaElement", "value").set
     when isSelect(this)
       descriptor("HTMLSelectElement", "value").set
+    when isButton(this)
+      descriptor("HTMLButtonElement", "value").set
     else
       ## is an options element
       descriptor("HTMLOptionElement", "value").set
@@ -98,19 +102,34 @@ _isContentEditable = ->
     else
       descriptor("HTMLElement", "isContentEditable").get
 
+_setType = ->
+  switch
+    when isInput(this)
+      descriptor("HTMLInputElement", "type").set
+    when isButton(this)
+      descriptor("HTMLButtonElement", "type").set
+
+
+_getType = ->
+  switch
+    when isInput(this)
+      descriptor("HTMLInputElement", "type").get
+    when isButton(this)
+      descriptor("HTMLButtonElement", "type").get
+
 nativeGetters = {
   value: _getValue
   selectionStart: descriptor("HTMLInputElement", "selectionStart").get
   isContentEditable: _isContentEditable
   isCollapsed: descriptor("Selection", 'isCollapsed').get
   selectionStart: _getSelectionStart
   selectionEnd: _getSelectionEnd
-  type: descriptor("HTMLInputElement", "type").get
+  type: _getType
 }
 
 nativeSetters = {
   value: _setValue
-  type: descriptor("HTMLInputElement", "type").set
+  type: _setType
 }
 
 nativeMethods = {
@@ -199,6 +218,9 @@ isTextarea = (el) ->
 isInput = (el) ->
   getTagName(el) is 'input'
 
+isButton = (el) ->
+  getTagName(el) is 'button'
+
 isSelect = (el) ->
   getTagName(el) is 'select'
 
@@ -223,11 +245,11 @@ isElement = (obj) ->
 isFocusable = ($el) ->
   $el.is(focusable)
 
-isInputType = ($el, type) ->
+isType = ($el, type) ->
   el = [].concat($jquery.unwrap($el))[0]
   ## NOTE: use DOMElement.type instead of getAttribute('type') since
   ##       <input type="asdf"> will have type="text", and behaves like text type
-  isInput(el) && (getNativeProp(el, 'type') or "").toLowerCase() is type
+  (getNativeProp(el, 'type') or "").toLowerCase() is type
 
 isScrollOrAuto = (prop) ->
   prop is "scroll" or prop is "auto"
@@ -287,7 +309,7 @@ isSame = ($el1, $el2) ->
 
 isTextLike = ($el) ->
   sel = (selector) -> isSelector($el, selector)
-  type = (type) -> isInputType($el, type)
+  type = (type) -> isType($el, type)
 
   isContentEditableElement = isContentEditable($el.get(0))
 
@@ -544,7 +566,7 @@ module.exports = {
 
   isTextarea
 
-  isInputType
+  isType
 
   isNeedSingleValueChangeInputElement
 
diff --git a/packages/driver/src/dom/index.coffee b/packages/driver/src/dom/index.coffee
@@ -1,4 +1,3 @@
-$utils = require("../cypress/utils")
 $jquery = require("./jquery")
 $window = require("./window")
 $document = require("./document")
@@ -10,7 +9,7 @@ $coordinates = require("./coordinates")
 { isDocument } = $document
 { wrap, unwrap, isJquery } = $jquery
 { isVisible, isHidden, getReasonIsHidden } = $visibility
-{ isInputType, isFocusable, isElement, isScrollable, stringify, getElements, getContainsSelector, getFirstDeepestElement, isDetached, isAttached, isTextLike, isSelector, isDescendent,  getFirstFixedOrStickyPositionParent, getFirstStickyPositionParent,  getFirstScrollableParent } = $elements
+{ isType, isFocusable, isElement, isScrollable, stringify, getElements, getContainsSelector, getFirstDeepestElement, isDetached, isAttached, isTextLike, isSelector, isDescendent,  getFirstFixedOrStickyPositionParent, getFirstStickyPositionParent,  getFirstScrollableParent } = $elements
 { getCoordsByPosition, getElementPositioning, getElementCoordinatesByPosition, getElementAtPointFromViewport, getElementCoordinatesByPositionRelativeToXY } = $coordinates
 
 isDom = (obj) ->
@@ -28,11 +27,7 @@ module.exports = {
 
   isDom
 
-  isInputType
-
-  isType: (args...) ->
-    $utils.warning('Cypress.dom.isType is deprecated. Use Cypress.dom.isInputType instead.')
-    isInputType(args...)
+  isType
 
   isVisible
 
diff --git a/packages/driver/src/dom/selection.coffee b/packages/driver/src/dom/selection.coffee
@@ -266,7 +266,7 @@ _moveCursorUpOrDown = (el, up) ->
   ## on an input, instead of moving the cursor
   ## we want to perform the native browser action
   ## which is to increment the step/interval
-    if $elements.isInputType(el, "number")
+    if $elements.isType(el, "number")
       if up then el.stepUp?() else el.stepDown?()
     return
 
diff --git a/packages/driver/test/cypress/fixtures/dom.html b/packages/driver/test/cypress/fixtures/dom.html
@@ -244,6 +244,7 @@
         <form id="multiple-inputs-and-button-submit">
           <input name="fname" />
           <input name="lname" />
+          <button type="button">button</button>
           <button type="submit">submit me</button>
         </form>
 
diff --git a/packages/driver/test/cypress/integration/commands/actions/click_spec.coffee b/packages/driver/test/cypress/integration/commands/actions/click_spec.coffee
@@ -1105,7 +1105,7 @@ describe "src/cy/commands/actions/click", ->
         num = cy.$$("button").length
 
         cy.on "fail", (err) ->
-          expect(err.message).to.eq "cy.click() can only be called on a single element. Your subject contained 14 elements. Pass { multiple: true } if you want to serially click each element."
+          expect(err.message).to.eq "cy.click() can only be called on a single element. Your subject contained 15 elements. Pass { multiple: true } if you want to serially click each element."
           done()
 
         cy.get("button").click()
diff --git a/packages/driver/test/cypress/integration/commands/actions/trigger_spec.coffee b/packages/driver/test/cypress/integration/commands/actions/trigger_spec.coffee
@@ -602,7 +602,7 @@ describe "src/cy/commands/actions/trigger", ->
 
       it "throws when eventName is not a string", ->
         cy.on "fail", (err) ->
-          expect(err.message).to.eq "cy.trigger() can only be called on a single element. Your subject contained 14 elements."
+          expect(err.message).to.eq "cy.trigger() can only be called on a single element. Your subject contained 15 elements."
           done()
 
         cy.get("button:first").trigger("cy.trigger() must be passed a non-empty string as its 1st argument. You passed: 'undefined'.")
diff --git a/packages/driver/test/cypress/integration/cypress/cypress_spec.coffee b/packages/driver/test/cypress/integration/cypress/cypress_spec.coffee
@@ -1,7 +1,5 @@
 $ = Cypress.$
 Promise = Cypress.Promise
-$utils = Cypress.utils
-
 
 describe "driver/src/cypress/index", ->
   beforeEach ->
@@ -39,10 +37,3 @@ describe "driver/src/cypress/index", ->
         Cypress.Log.command({})
 
       expect(fn).to.throw(/has been renamed to Cypress.log/)
-
-  context "Deprecated", ->
-    it "warns with deprecated Cypress.dom.isType", ->
-      warnSpy = cy.spy($utils, "warning")
-      isText = Cypress.dom.isType($('<input type="asdf"/>'), 'text')
-      expect(isText).to.eq true
-      expect(warnSpy.called).to.eq true
