'max-len' conflict with 'function-paren-newline'

There currently appears to be no way to use function-paren-newline in a way that takes account of maximum line length. With the default multiline option and a function with a single long parameter name, there is no way to format the code without violating either function-paren-newline or max-len. Examples:

1. This snippet:

export default connect(mapStateToProps, mapDispatchToProps)(
  generateDndContextWithBackend(SiteEditorContainer));

triggers the error Unexpected newline after "(".

1. Reformatting to:

export default connect(mapStateToProps, mapDispatchToProps)(
  generateDndContextWithBackend(SiteEditorContainer),
);

triggers the error twice:

Unexpected newline after "("
Unexpected newline before ")"

1. Removing all the newlines:

export default connect(mapStateToProps, mapDispatchToProps)(generateDndContextWithBackend(SiteEditorContainer));

Triggers the max-len error. If there is an error-free formatting solution given the current defaults, please educate me!

If this is a bug, one possibility could be to make the existing multiline option sensitive to max line length. Another could be to create a new option.

ESLint Version: 4.8.0 Node Version: 6.11.1 npm Version: 5.2.0

eslintrc

{

  "extends": "airbnb",
  "plugins": [
    "react"
  ],
  "parser": "babel-eslint",
  "parserOptions": {
    "ecmaFeatures": {
        "jsx": true
    }
  },
  "rules": {
    "jsx-a11y/click-events-have-key-events": "off",
    "jsx-a11y/anchor-is-valid": "off",
    "react/display-name": 0,
    "react/require-default-props": 0,
    "indent": ["error", 2, {"SwitchCase": 1}],
    "no-mixed-operators": ["error", {
      "groups": [
        ["+", "-", "*", "/", "%", "**"],
        ["&", "|", "^", "~", "<<", ">>", ">>>"],
        ["==", "!=", "===", "!==", ">", ">=", "<", "<="],
        ["&&", "||"],
        ["in", "instanceof"]
      ],
      allowSamePrecedence: true
    }],
    "object-curly-newline": "off"
  },
  "env": {
    "browser": true,
    "node": true,
    "es6": true,
    "amd" : true,
    "mocha": true,
    "jest": true
  }
}

This issue originally raised at https://github.com/airbnb/javascript/issues/1584

[the-noob]

I have this bit from a create-react-app install and after upgrading to 4.10 this fails with multiline

const isLocalhost = Boolean(
  window.location.hostname === 'localhost' ||
  // [::1] is the IPv6 localhost address.
  window.location.hostname === '[::1]' ||
  // 127.0.0.1/8 is considered localhost for IPv4.
  window.location.hostname.match(
    /^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/,
  ),
);

[noahgrant]

thanks, @not-an-aardvark. for posterity, i did implement my versions of the rules i commented about (array-element-newline and function-paren-newline) in a custom plugin eslint-plugin-sift.