Skip to content

Instantly share code, notes, and snippets.

@chalin
Created March 19, 2014 16:36
Show Gist options
  • Save chalin/9645690 to your computer and use it in GitHub Desktop.
Save chalin/9645690 to your computer and use it in GitHub Desktop.
Reading `InputElement.valueAsDate` results in NullError (Cannot call "getTime" on null), but should just be null value
# Clicking on each link yields:
number.value => ''
number.valueAsNumber => NaN
number.valueAsDate => Exception: NullError: Cannot call "getTime" on null
date.value => ''
date.valueAsNumber => NaN
date.valueAsDate => Exception: NullError: Cannot call "getTime" on null
time.value => ''
time.valueAsNumber => NaN
time.valueAsDate => Exception: NullError: Cannot call "getTime" on null
datetime.value => ''
datetime.valueAsNumber => NaN
datetime.valueAsDate => Exception: NullError: Cannot call "getTime" on null
datetime-local.value => ''
datetime-local.valueAsNumber => NaN
datetime-local.valueAsDate => Exception: NullError: Cannot call "getTime" on null
month.value => ''
month.valueAsNumber => NaN
month.valueAsDate => Exception: NullError: Cannot call "getTime" on null
week.value => ''
week.valueAsNumber => NaN
week.valueAsDate => Exception: NullError: Cannot call "getTime" on null
import 'dart:html';
void main() {
querySelectorAll('.valueAsDate')..onClick.listen(readValueAsDate('valueAsDate', getValueAsDate));
querySelectorAll('.valueAsNumber')..onClick.listen(readValueAsDate('valueAsNumber', getValueAsNumber));
querySelectorAll('.value')..onClick.listen(readValueAsDate('value', getValue));
}
DateTime getValueAsDate(InputElement e) => e.valueAsDate;
num getValueAsNumber(InputElement e) => e.valueAsNumber;
String getValue(InputElement e) => e.value;
Function readValueAsDate(String valueAsFieldName, Function getter) =>
(MouseEvent event) {
var inputType = (event.target as Element).attributes['data-type'];
var elt = querySelector('input[type=$inputType]'),
result;
try {
result = getter(elt).toString();
querySelector("#result").text = result;
} catch (e) {
result = "Exception: $e";
}
var resultStr = result != null && result.isEmpty ? "''" : result;
print("$inputType.$valueAsFieldName => $resultStr");
event.preventDefault();
};
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Dart date bug</title>
<link rel="stylesheet" href="dart_date_bug.css">
</head>
<body>
<h1>Dart date bug</h1>
<p>Result shown here: <span id="result"></span></p>
<form action="">
<fieldset>
<legend>Read date/time inputs</legend>
<label>Number: <input type="number"></label>
<a href="#" data-type="number" class=valueAsDate>[valueAsDate]</a>
<a href="#" data-type="number" class=valueAsNumber>[valueAsNumber]</a>
<a href="#" data-type="number" class=value>[value]</a>
<br>
<!-- -->
<label>Date: <input type="date"></label>
<a href="#" data-type="date" class=valueAsDate>[valueAsDate]</a>
<a href="#" data-type="date" class=valueAsNumber>[valueAsNumber]</a>
<a href="#" data-type="date" class=value>[value]</a>
<br>
<!-- -->
<label>Time: <input type="time"></label>
<a href="#" data-type="time" class=valueAsDate>[valueAsDate]</a>
<a href="#" data-type="time" class=valueAsNumber>[valueAsNumber]</a>
<a href="#" data-type="time" class=value>[value]</a>
<br>
<!-- -->
<label>Datetime: <input type="datetime">
</label>
<a href="#" data-type="datetime" class=valueAsDate>[valueAsDate]</a>
<a href="#" data-type="datetime" class=valueAsNumber>[valueAsNumber]</a>
<a href="#" data-type="datetime" class=value>[value]</a>
<br>
<!-- -->
<label>Datetime local: <input type="datetime-local">
</label>
<a href="#" data-type="datetime-local" class=valueAsDate>[valueAsDate]</a>
<a href="#" data-type="datetime-local" class=valueAsNumber>[valueAsNumber]</a>
<a href="#" data-type="datetime-local" class=value>[value]</a>
<br>
<!-- -->
<label>Month: <input type="month"></label>
<a href="#" data-type="month" class=valueAsDate>[valueAsDate]</a>
<a href="#" data-type="month" class=valueAsNumber>[valueAsNumber]</a>
<a href="#" data-type="month" class=value>[value]</a>
<br>
<!-- -->
<label>Week: <input type="week"></label>
<a href="#" data-type="week" class=valueAsDate>[valueAsDate]</a>
<a href="#" data-type="week" class=valueAsNumber>[valueAsNumber]</a>
<a href="#" data-type="week" class=value>[value]</a>
<br>
</fieldset>
</form>
<script type="application/dart" src="dart_date_bug.dart"></script>
<script src="packages/browser/dart.js"></script>
</body>
</html>
# Clicking on each link yields:
number.value => ''
number.valueAsNumber => NaN
number.valueAsDate => null
date.value => ''
date.valueAsNumber => NaN
date.valueAsDate => null
time.value => ''
time.valueAsNumber => NaN
time.valueAsDate => null
datetime.value => ''
datetime.valueAsNumber => NaN
datetime.valueAsDate => null
datetime-local.value => ''
datetime-local.valueAsNumber => NaN
datetime-local.valueAsDate => null
month.value => ''
month.valueAsNumber => NaN
month.valueAsDate => null
week.value => ''
week.valueAsNumber => NaN
week.valueAsDate => null
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment