11944947852

Committed 21 Nov 2024 01:37AM UTC coverage: 40.509% (-42.4%) from 82.888%

Build # 11944947852

Build Type

Pull #901

github

Committed by

web-flow

Commit Message

Merge c469ddcae into c106ab483

Pull Request Pull Request #901: feat: add CrossFlicking Preset

Run Details

2294 of 7653 branches covered (29.98%)

Branch coverage included in aggregate %.

319 of 380 new or added lines in 11 files covered. (83.95%)

5581 existing lines in 49 files now uncovered.

5570 of 11760 relevant lines covered (47.36%)

12.61 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

28.85

/packages/react-flicking/src/react-flicking/CrossFlicking.tsx

/*
 * Copyright (c) 2015 NAVER Corp.
 * egjs projects are licensed under the MIT license
 */
import * as React from "react";
import ListDiffer from "@egjs/list-differ";
import {
  CrossFlicking as VanillaCrossFlicking,
  NormalRenderingStrategy,
  CrossFlickingEvent,
  HoldStartEvent,
  HoldEndEvent,
  MoveStartEvent,
  MoveEvent,
  MoveEndEvent,
  WillChangeEvent,
  ChangedEvent,
  EVENTS,
  SIDE_EVENTS,
  CrossFlickingOptions,
  FlickingOptions,
} from "@egjs/flicking";

import { DEFAULT_PROPS } from "./consts";
import { FlickingProps } from "./types";
import ReactRenderer, { ReactRendererOptions } from "./ReactRenderer";
import ReactElementProvider from "./ReactElementProvider";
import Flicking from "./Flicking";

export interface CrossFlickingProps extends FlickingProps {
  onSideHoldStart: (e: CrossFlickingEvent<HoldStartEvent<Flicking>>) => any;
  onSideHoldEnd: (e: CrossFlickingEvent<HoldEndEvent<Flicking>>) => any;
  onSideMoveStart: (e: CrossFlickingEvent<MoveStartEvent<Flicking>>) => any;
  onSideMove: (e: CrossFlickingEvent<MoveEvent<Flicking>>) => any;
  onSideMoveEnd: (e: CrossFlickingEvent<MoveEndEvent<Flicking>>) => any;
  onSideWillChange: (e: CrossFlickingEvent<WillChangeEvent<Flicking>>) => any;
  onSideChanged: (e: CrossFlickingEvent<ChangedEvent<Flicking>>) => any;
}

export const CROSSFLICKING_DEFAULT_PROPS: CrossFlickingProps = {
  ...DEFAULT_PROPS,
  onSideHoldStart: (e: CrossFlickingEvent<HoldStartEvent>) => {},
  onSideHoldEnd: (e: CrossFlickingEvent<HoldEndEvent>) => {},
  onSideMoveStart: (e: CrossFlickingEvent<MoveStartEvent>) => {},
  onSideMove: (e: CrossFlickingEvent<MoveEvent>) => {},
  onSideMoveEnd: (e: CrossFlickingEvent<MoveEndEvent>) => {},
  onSideWillChange: (e: CrossFlickingEvent<WillChangeEvent>) => {},
  onSideChanged: (e: CrossFlickingEvent<ChangedEvent>) => {},
};

class CrossFlicking extends Flicking {
  public static defaultProps: CrossFlickingProps = CROSSFLICKING_DEFAULT_PROPS;

  public constructor(
    props: Partial<
      FlickingProps &
        FlickingOptions &
        CrossFlickingOptions &
        CrossFlickingProps
    >
  ) {
    super(props);
  }

  public componentDidMount() {
    const props = this.props as Required<CrossFlickingProps>;
    const rendererOptions: ReactRendererOptions = {
      reactFlicking: this,
      strategy: new NormalRenderingStrategy({
        providerCtor: ReactElementProvider,
      }),
    };

    const flicking = new VanillaCrossFlicking(this._viewportElement, {
      ...props,
      externalRenderer: new ReactRenderer(rendererOptions),
    });

    this._vanillaFlicking = flicking;

    const children = this._getChildren();
    this._jsxDiffer = new ListDiffer(children, (panel) => panel.key!);
    this._pluginsDiffer = new ListDiffer<any>();
    this._prevChildren = children;

    this._bindEvents();
    this._checkPlugins();

    if (props.status) {
      flicking.setStatus(props.status);
    }
  }

  public render() {
    const props = this.props;
    const Viewport = props.viewportTag as any;
    const Camera = props.cameraTag as any;
    const attributes: { [key: string]: any } = {};

    this.beforeRender();

    for (const name in props) {
      if (!(name in CROSSFLICKING_DEFAULT_PROPS) && !(name in VanillaCrossFlicking.prototype)) {
        attributes[name] = props[name];
      }
    }

    const { viewportClasses, cameraClasses, cameraProps } = this._getClasses(attributes, props);

    const panels = this._getPanels();

    return (
      <Viewport {...attributes} className={viewportClasses.join(" ")} ref={(e?: HTMLElement) => {
        e && (this._viewportElement = e);
      }}>
        <Camera className={cameraClasses.join(" ")} {...cameraProps}>
          { panels }
        </Camera>
        { this._getViewportSlot() }
      </Viewport>
    );
  }

  protected _bindEvents() {
    super._bindEvents();

    Object.keys(SIDE_EVENTS).forEach((eventKey: keyof typeof EVENTS) => {
      const eventName = SIDE_EVENTS[eventKey];
      this._bindEvent(eventName);
    });
  }
}

interface CrossFlicking extends Flicking {}
export default CrossFlicking;

1	/*
2	* Copyright (c) 2015 NAVER Corp.
3	* egjs projects are licensed under the MIT license
4	*/
5	import * as React from "react";	5✔
6	import ListDiffer from "@egjs/list-differ";	5✔
7	import {	5✔
8	CrossFlicking as VanillaCrossFlicking,
9	NormalRenderingStrategy,
10	CrossFlickingEvent,
11	HoldStartEvent,
12	HoldEndEvent,
13	MoveStartEvent,
14	MoveEvent,
15	MoveEndEvent,
16	WillChangeEvent,
17	ChangedEvent,
18	EVENTS,
19	SIDE_EVENTS,
20	CrossFlickingOptions,
21	FlickingOptions,
22	} from "@egjs/flicking";
23
24	import { DEFAULT_PROPS } from "./consts";	5✔
25	import { FlickingProps } from "./types";
26	import ReactRenderer, { ReactRendererOptions } from "./ReactRenderer";	5✔
27	import ReactElementProvider from "./ReactElementProvider";	5✔
28	import Flicking from "./Flicking";	5✔
29
30	export interface CrossFlickingProps extends FlickingProps {
31	onSideHoldStart: (e: CrossFlickingEvent<HoldStartEvent<Flicking>>) => any;
32	onSideHoldEnd: (e: CrossFlickingEvent<HoldEndEvent<Flicking>>) => any;
33	onSideMoveStart: (e: CrossFlickingEvent<MoveStartEvent<Flicking>>) => any;
34	onSideMove: (e: CrossFlickingEvent<MoveEvent<Flicking>>) => any;
35	onSideMoveEnd: (e: CrossFlickingEvent<MoveEndEvent<Flicking>>) => any;
36	onSideWillChange: (e: CrossFlickingEvent<WillChangeEvent<Flicking>>) => any;
37	onSideChanged: (e: CrossFlickingEvent<ChangedEvent<Flicking>>) => any;
38	}
39
40	export const CROSSFLICKING_DEFAULT_PROPS: CrossFlickingProps = {	5✔
41	...DEFAULT_PROPS,
42	onSideHoldStart: (e: CrossFlickingEvent<HoldStartEvent>) => {},
43	onSideHoldEnd: (e: CrossFlickingEvent<HoldEndEvent>) => {},
44	onSideMoveStart: (e: CrossFlickingEvent<MoveStartEvent>) => {},
45	onSideMove: (e: CrossFlickingEvent<MoveEvent>) => {},
46	onSideMoveEnd: (e: CrossFlickingEvent<MoveEndEvent>) => {},
47	onSideWillChange: (e: CrossFlickingEvent<WillChangeEvent>) => {},
48	onSideChanged: (e: CrossFlickingEvent<ChangedEvent>) => {},
49	};
50
51	class CrossFlicking extends Flicking {	5✔
52	public static defaultProps: CrossFlickingProps = CROSSFLICKING_DEFAULT_PROPS;	5✔
53
54	public constructor(
55	props: Partial<
56	FlickingProps &
57	FlickingOptions &
58	CrossFlickingOptions &
59	CrossFlickingProps
60	>
61	) {
NEW 62	super(props);	×
63	}
64
65	public componentDidMount() {	5✔
NEW 66	const props = this.props as Required<CrossFlickingProps>;	×
NEW 67	const rendererOptions: ReactRendererOptions = {	×
68	reactFlicking: this,
69	strategy: new NormalRenderingStrategy({
70	providerCtor: ReactElementProvider,
71	}),
72	};
73
NEW 74	const flicking = new VanillaCrossFlicking(this._viewportElement, {	×
75	...props,
76	externalRenderer: new ReactRenderer(rendererOptions),
77	});
78
NEW 79	this._vanillaFlicking = flicking;	×
80
NEW 81	const children = this._getChildren();	×
NEW 82	this._jsxDiffer = new ListDiffer(children, (panel) => panel.key!);	×
NEW 83	this._pluginsDiffer = new ListDiffer<any>();	×
NEW 84	this._prevChildren = children;	×
85
NEW 86	this._bindEvents();	×
NEW 87	this._checkPlugins();	×
88
NEW 89	if (props.status) {	×
NEW 90	flicking.setStatus(props.status);	×
91	}
92	}
93
94	public render() {	5✔
NEW 95	const props = this.props;	×
NEW 96	const Viewport = props.viewportTag as any;	×
NEW 97	const Camera = props.cameraTag as any;	×
NEW 98	const attributes: { [key: string]: any } = {};	×
99
NEW 100	this.beforeRender();	×
101
NEW 102	for (const name in props) {	×
NEW 103	if (!(name in CROSSFLICKING_DEFAULT_PROPS) && !(name in VanillaCrossFlicking.prototype)) {	×
NEW 104	attributes[name] = props[name];	×
105	}
106	}
107
NEW 108	const { viewportClasses, cameraClasses, cameraProps } = this._getClasses(attributes, props);	×
109
NEW 110	const panels = this._getPanels();	×
111
NEW 112	return (	×
113	<Viewport {...attributes} className={viewportClasses.join(" ")} ref={(e?: HTMLElement) => {
NEW 114	e && (this._viewportElement = e);	×
115	}}>
116	<Camera className={cameraClasses.join(" ")} {...cameraProps}>
117	{ panels }
118	</Camera>
119	{ this._getViewportSlot() }
120	</Viewport>
121	);
122	}
123
124	protected _bindEvents() {	5✔
NEW 125	super._bindEvents();	×
126
NEW 127	Object.keys(SIDE_EVENTS).forEach((eventKey: keyof typeof EVENTS) => {	×
NEW 128	const eventName = SIDE_EVENTS[eventKey];	×
NEW 129	this._bindEvent(eventName);	×
130	});
131	}
132	}	5✔
133
134	interface CrossFlicking extends Flicking {}
135	export default CrossFlicking;	5✔

naver / egjs-flicking / 11944947852

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous