diff --git a/lib/react.dart b/lib/react.dart index b45a5905..cc23fc7f 100644 --- a/lib/react.dart +++ b/lib/react.dart @@ -836,6 +836,56 @@ class SyntheticTouchEvent extends SyntheticEvent { isTrusted, nativeEvent, target, timeStamp, type) {} } +class SyntheticTransitionEvent extends SyntheticEvent { + final String propertyName; + final num elapsedTime; + final String pseudoElement; + + SyntheticTransitionEvent( + bubbles, + cancelable, + currentTarget, + _defaultPrevented, + _preventDefault, + stopPropagation, + eventPhase, + isTrusted, + nativeEvent, + target, + timeStamp, + type, + this.propertyName, + this.elapsedTime, + this.pseudoElement) + : super(bubbles, cancelable, currentTarget, _defaultPrevented, _preventDefault, stopPropagation, eventPhase, + isTrusted, nativeEvent, target, timeStamp, type) {} +} + +class SyntheticAnimationEvent extends SyntheticEvent { + final String animationName; + final num elapsedTime; + final String pseudoElement; + + SyntheticAnimationEvent( + bubbles, + cancelable, + currentTarget, + _defaultPrevented, + _preventDefault, + stopPropagation, + eventPhase, + isTrusted, + nativeEvent, + target, + timeStamp, + type, + this.animationName, + this.elapsedTime, + this.pseudoElement) + : super(bubbles, cancelable, currentTarget, _defaultPrevented, _preventDefault, stopPropagation, eventPhase, + isTrusted, nativeEvent, target, timeStamp, type) {} +} + class SyntheticUIEvent extends SyntheticEvent { final num detail; final /*DOMAbstractView*/ view; diff --git a/lib/react_client.dart b/lib/react_client.dart index 8532f8dd..31ab7cb0 100644 --- a/lib/react_client.dart +++ b/lib/react_client.dart @@ -731,6 +731,48 @@ SyntheticTouchEvent syntheticTouchEventFactory(events.SyntheticTouchEvent e) { ); } +/// Wrapper for [SyntheticTransitionEvent]. +SyntheticTransitionEvent syntheticTransitionEventFactory(events.SyntheticTransitionEvent e) { + return new SyntheticTransitionEvent( + e.bubbles, + e.cancelable, + e.currentTarget, + e.defaultPrevented, + () => e.preventDefault(), + () => e.stopPropagation(), + e.eventPhase, + e.isTrusted, + e.nativeEvent, + e.target, + e.timeStamp, + e.type, + e.propertyName, + e.elapsedTime, + e.pseudoElement, + ); +} + +/// Wrapper for [SyntheticAnimationEvent]. +SyntheticAnimationEvent syntheticAnimationEventFactory(events.SyntheticAnimationEvent e) { + return new SyntheticAnimationEvent( + e.bubbles, + e.cancelable, + e.currentTarget, + e.defaultPrevented, + () => e.preventDefault(), + () => e.stopPropagation(), + e.eventPhase, + e.isTrusted, + e.nativeEvent, + e.target, + e.timeStamp, + e.type, + e.animationName, + e.elapsedTime, + e.pseudoElement, + ); +} + /// Wrapper for [SyntheticUIEvent]. SyntheticUIEvent syntheticUIEventFactory(events.SyntheticUIEvent e) { return new SyntheticUIEvent( diff --git a/lib/react_test_utils.dart b/lib/react_test_utils.dart index 7327a3e1..dc1e5c69 100644 --- a/lib/react_test_utils.dart +++ b/lib/react_test_utils.dart @@ -58,6 +58,12 @@ typedef bool ComponentTestFunction(/* [1] */ component); /// This should include all events documented at: /// http://facebook.github.io/react/docs/events.html class Simulate { + static void animationEnd(/* [1] */ componentOrNode, [Map eventData = const {}]) => + simulate_wrappers.Simulate.animationEnd(componentOrNode, jsify(eventData)); + static void animationIteration(/* [1] */ componentOrNode, [Map eventData = const {}]) => + simulate_wrappers.Simulate.animationIteration(componentOrNode, jsify(eventData)); + static void animationStart(/* [1] */ componentOrNode, [Map eventData = const {}]) => + simulate_wrappers.Simulate.animationStart(componentOrNode, jsify(eventData)); static void blur(/* [1] */ componentOrNode, [Map eventData = const {}]) => simulate_wrappers.Simulate.blur(componentOrNode, jsify(eventData)); static void change(/* [1] */ componentOrNode, [Map eventData = const {}]) => @@ -122,6 +128,8 @@ class Simulate { simulate_wrappers.Simulate.touchMove(componentOrNode, jsify(eventData)); static void touchStart(/* [1] */ componentOrNode, [Map eventData = const {}]) => simulate_wrappers.Simulate.touchStart(componentOrNode, jsify(eventData)); + static void transitionEnd(/* [1] */ componentOrNode, [Map eventData = const {}]) => + simulate_wrappers.Simulate.transitionEnd(componentOrNode, jsify(eventData)); static void wheel(/* [1] */ componentOrNode, [Map eventData = const {}]) => simulate_wrappers.Simulate.wheel(componentOrNode, jsify(eventData)); } @@ -143,6 +151,12 @@ class Simulate { /// which the `react` Dart package will be upgrading to in the `5.0.0` release. @Deprecated('5.0.0') class SimulateNative { + static void animationEnd(/* [1] */ componentOrNode, [Map eventData = const {}]) => + simulate_wrappers.SimulateNative.animationEnd(componentOrNode, jsify(eventData)); + static void animationIteration(/* [1] */ componentOrNode, [Map eventData = const {}]) => + simulate_wrappers.SimulateNative.animationIteration(componentOrNode, jsify(eventData)); + static void animationStart(/* [1] */ componentOrNode, [Map eventData = const {}]) => + simulate_wrappers.SimulateNative.animationStart(componentOrNode, jsify(eventData)); static void blur(/* [1] */ componentOrNode, [Map eventData = const {}]) => simulate_wrappers.SimulateNative.blur(componentOrNode, jsify(eventData)); static void click(/* [1] */ componentOrNode, [Map eventData = const {}]) => @@ -203,6 +217,8 @@ class SimulateNative { simulate_wrappers.SimulateNative.touchMove(componentOrNode, jsify(eventData)); static void touchStart(/* [1] */ componentOrNode, [Map eventData = const {}]) => simulate_wrappers.SimulateNative.touchStart(componentOrNode, jsify(eventData)); + static void transitionEnd(/* [1] */ componentOrNode, [Map eventData = const {}]) => + simulate_wrappers.SimulateNative.transitionEnd(componentOrNode, jsify(eventData)); static void wheel(/* [1] */ componentOrNode, [Map eventData = const {}]) => simulate_wrappers.SimulateNative.wheel(componentOrNode, jsify(eventData)); } diff --git a/lib/src/react_client/event_prop_key_to_event_factory.dart b/lib/src/react_client/event_prop_key_to_event_factory.dart index fe69defc..130a7b6c 100644 --- a/lib/src/react_client/event_prop_key_to_event_factory.dart +++ b/lib/src/react_client/event_prop_key_to_event_factory.dart @@ -51,6 +51,14 @@ final Map eventPropKeyToEventFactory = (() { 'onTouchMove': syntheticTouchEventFactory, 'onTouchStart': syntheticTouchEventFactory, + // SyntheticTransitionEvent + 'onTransitionEnd': syntheticTransitionEventFactory, + + // SyntheticAnimationEvent + 'onAnimationEnd': syntheticAnimationEventFactory, + 'onAnimationIteration': syntheticAnimationEventFactory, + 'onAnimationStart': syntheticAnimationEventFactory, + // SyntheticUIEvent 'onScroll': syntheticUIEventFactory, diff --git a/lib/src/react_client/synthetic_event_wrappers.dart b/lib/src/react_client/synthetic_event_wrappers.dart index ad3fee84..5abd288d 100644 --- a/lib/src/react_client/synthetic_event_wrappers.dart +++ b/lib/src/react_client/synthetic_event_wrappers.dart @@ -99,6 +99,22 @@ class SyntheticTouchEvent extends SyntheticEvent { external TouchList get touches; } +@JS() +@anonymous +class SyntheticTransitionEvent extends SyntheticEvent { + external String get propertyName; + external num get elapsedTime; + external String get pseudoElement; +} + +@JS() +@anonymous +class SyntheticAnimationEvent extends SyntheticEvent { + external String get animationName; + external num get elapsedTime; + external String get pseudoElement; +} + @JS() @anonymous class SyntheticUIEvent extends SyntheticEvent { diff --git a/lib/src/react_test_utils/simulate_wrappers.dart b/lib/src/react_test_utils/simulate_wrappers.dart index a14dcc38..af69f3a0 100644 --- a/lib/src/react_test_utils/simulate_wrappers.dart +++ b/lib/src/react_test_utils/simulate_wrappers.dart @@ -9,6 +9,9 @@ import 'package:js/js.dart'; @JS('React.addons.TestUtils.Simulate') abstract class Simulate { + external static void animationEnd(componentOrNode, [eventData]); + external static void animationIteration(componentOrNode, [eventData]); + external static void animationStart(componentOrNode, [eventData]); external static void blur(componentOrNode, [eventData]); external static void change(componentOrNode, [eventData]); external static void click(componentOrNode, [eventData]); @@ -41,11 +44,15 @@ abstract class Simulate { external static void touchEnd(componentOrNode, [eventData]); external static void touchMove(componentOrNode, [eventData]); external static void touchStart(componentOrNode, [eventData]); + external static void transitionEnd(componentOrNode, [eventData]); external static void wheel(componentOrNode, [eventData]); } @JS('React.addons.TestUtils.SimulateNative') abstract class SimulateNative { + external static void animationEnd(componentOrNode, [eventData]); + external static void animationIteration(componentOrNode, [eventData]); + external static void animationStart(componentOrNode, [eventData]); external static void blur(componentOrNode, [eventData]); external static void click(componentOrNode, [eventData]); external static void contextMenu(componentOrNode, [eventData]); @@ -76,5 +83,6 @@ abstract class SimulateNative { external static void touchEnd(componentOrNode, [eventData]); external static void touchMove(componentOrNode, [eventData]); external static void touchStart(componentOrNode, [eventData]); + external static void transitionEnd(componentOrNode, [eventData]); external static void wheel(componentOrNode, [eventData]); } diff --git a/test/react_test_utils_test.dart b/test/react_test_utils_test.dart index cf205e67..43fd6cf0 100644 --- a/test/react_test_utils_test.dart +++ b/test/react_test_utils_test.dart @@ -82,9 +82,10 @@ void main() { }); } - ; - group('event', () { + group('animationEnd', () => testEvent(Simulate.animationEnd, 'animationEnd')); + group('animationIteration', () => testEvent(Simulate.animationIteration, 'animationIteration')); + group('animationStart', () => testEvent(Simulate.animationStart, 'animationStart')); group('blur', () => testEvent(Simulate.blur, 'blur')); group('change', () => testEvent(Simulate.change, 'change')); group('click', () => testEvent(Simulate.click, 'click')); @@ -116,10 +117,14 @@ void main() { group('touchEnd', () => testEvent(Simulate.touchEnd, 'touchEnd')); group('touchMove', () => testEvent(Simulate.touchMove, 'touchMove')); group('touchStart', () => testEvent(Simulate.touchStart, 'touchStart')); + group('transitionEnd', () => testEvent(Simulate.transitionEnd, 'transitionEnd')); group('wheel', () => testEvent(Simulate.wheel, 'wheel')); }); group('native event', () { + group('animationEnd', () => testEvent(SimulateNative.animationEnd, 'animationEnd')); + group('animationIteration', () => testEvent(SimulateNative.animationIteration, 'animationIteration')); + group('animationStart', () => testEvent(SimulateNative.animationStart, 'animationStart')); group('blur', () => testEvent(SimulateNative.blur, 'blur')); group('click', () => testEvent(SimulateNative.click, 'click')); group('copy', () => testEvent(SimulateNative.copy, 'copy')); @@ -149,6 +154,7 @@ void main() { group('touchEnd', () => testEvent(SimulateNative.touchEnd, 'touchEnd')); group('touchMove', () => testEvent(SimulateNative.touchMove, 'touchMove')); group('touchStart', () => testEvent(SimulateNative.touchStart, 'touchStart')); + group('transitionEnd', () => testEvent(SimulateNative.transitionEnd, 'transitionEnd')); group('wheel', () => testEvent(SimulateNative.wheel, 'wheel')); }); }); diff --git a/test/test_components.dart b/test/test_components.dart index bee3b2eb..9e022b1a 100644 --- a/test/test_components.dart +++ b/test/test_components.dart @@ -5,6 +5,9 @@ class EventComponent extends Component { getInitialState() => {'text': ''}; onEvent(SyntheticEvent e) => setState({'text': '${e.type} ${e.timeStamp}'}); render() => div({ + 'onAnimationEnd': onEvent, + 'onAnimationIteration': onEvent, + 'onAnimationStart': onEvent, 'onBlur': onEvent, 'onChange': onEvent, 'onClick': onEvent, @@ -37,6 +40,7 @@ class EventComponent extends Component { 'onTouchEnd': onEvent, 'onTouchMove': onEvent, 'onTouchStart': onEvent, + 'onTransitionEnd': onEvent, 'onWheel': onEvent }, state['text']); }