6768993966

Committed 06 Nov 2023 09:49AM UTC coverage: 78.279% (-0.1%) from 78.392%

Build # 6768993966

Build Type

push

github

Committed by

web-flow

Commit Message

Merge pull request #6 from prabhuignoto/fix_deepsource

fix deep source issues

Run Details

65 of 99 branches covered (0.0%)

Branch coverage included in aggregate %.

10 of 11 new or added lines in 2 files covered. (90.91%)

872 of 1098 relevant lines covered (79.42%)

3.7 hits per line

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

69.68

/src/effects/utils.ts

import { SelectionStyle } from '../models/core.model';
import { MouseMovementDirection } from '../models/mouse-position.model';
import {
  PopupDimensions,
  PopupPosition,
  TargetRect,
} from '../models/popup.model';

type PopupPlaceholderProps = {
  id: string;
};

const getDirection: (x: number, y: number) => MouseMovementDirection = (
  movX,
  movY
) => {
  // If the mouse movement is zero, return null
  if (movX === 0 && movY === 0) {
    return null;
  }

  // Get the absolute value of the mouse movement in the X and Y axes
  const absMovX = Math.abs(movX);
  const absMovY = Math.abs(movY);

  let direction = '';

  // Determine the direction of the mouse movement
  direction =
    absMovX > absMovY
      ? movX < 0
        ? 'left'
        : 'right'
      : movY < 0
      ? 'up'
      : 'down';

  // Return the direction
  return direction as MouseMovementDirection;
};

// eslint-disable-next-line @typescript-eslint/no-explicit-any
const styleobjectToCssText = (style: any) => {
  return Object.keys(style).reduce((acc, key) => {
    return `${acc}${key}:${style[key]};`;
  }, '');
};

const getSelectionDiv = (
  style: SelectionStyle = {
    backgroundColor: 'rgba(0, 123, 255, 0.1)',
    borderColor: 'rgba(0, 123, 255, 0.5)',
    borderStyle: 'dotted',
    borderWidth: 1,
  }
) => {
  const span = document.createElement('span');
  const { backgroundColor, borderColor, borderStyle, borderWidth } = style;
  span.style.cssText = styleobjectToCssText({
    position: 'absolute',
    zIndex: 99999,
    display: 'block',
    background: backgroundColor,
    border: `${borderWidth}px ${borderStyle} ${borderColor}`,
  });

  return span;
};

const getPointerImageWrapperDiv = () => {
  const imageWrapper = document.createElement('span');
  imageWrapper.style.cssText = styleobjectToCssText({
    position: 'absolute',
    display: 'block',
    width: '100%',
    height: '100%',
  });

  return imageWrapper;
};

const isTagTypeSpecial = (el: HTMLElement) => {
  const { tagName } = el;
  return (
    tagName === 'INPUT' ||
    tagName === 'TEXTAREA' ||
    tagName === 'BUTTON' ||
    tagName === 'A'
  );
};

/**
 * Creates a placeholder element for a popup component.
 * @param {PopupPlaceholderProps} props - The props object containing the id, target, height, width, and position of the popup.
 * @returns {HTMLDivElement} - The created placeholder element.
 */
const createPopupPlaceholder = ({
  id,
}: PopupPlaceholderProps): HTMLDivElement => {
  // const targetRect = target.getBoundingClientRect();

  // Create the placeholder element
  const placeholder = document.createElement('div');
  placeholder.id = id;
  placeholder.style.cssText = styleobjectToCssText({
    position: 'fixed',
    zIndex: '9999',
  });
  return placeholder;
};

const getAllHtmlAttrValues: (props: {
  ele: HTMLElement;
  names: string[];
}) => (string | null)[] = ({ ele, names }) => {
  if (ele) {
    return names.map((name) => ele.getAttribute(`data-${name}`));
  } else {
    return [];
  }
};

export {
  createPopupPlaceholder,
  getAllHtmlAttrValues,
  getDirection,
  getPointerImageWrapperDiv,
  getSelectionDiv,
  isTagTypeSpecial,
  styleobjectToCssText,
};

// Helper function to calculate popup position
export function calculatePopupPosition(
  position: PopupPosition,
  targetRect: TargetRect,
  dimensions: PopupDimensions,
  popupGap: number
): { top: number; left: number } {
  let left = 0;
  let top = 0;
  const { x, y, width: targetWidth, height: targetHeight } = targetRect;

  // Calculate the popup position
  switch (position) {
    case 'top':
      top = y - dimensions.height;
      break;
    case 'bottom':
      top = y + targetHeight;
      break;
    case 'left':
      left = x - dimensions.width - popupGap;
      break;
    case 'right':
      left = x + targetWidth + popupGap;
      break;
    default:
      break;
  }

  // Center the popup horizontally for top and bottom positions
  if (position === 'top' || position === 'bottom') {
    left = x + targetWidth / 2 - dimensions.width / 2;
  }

  // Center the popup vertically for left and right positions
  if (position === 'left' || position === 'right') {
    top = y + targetHeight / 2 - dimensions.height / 2;
  }

  return { top, left };
}

1	import { SelectionStyle } from '../models/core.model';	1✔
2	import { MouseMovementDirection } from '../models/mouse-position.model';	1✔
3	import {	1✔
4	PopupDimensions,	1✔
5	PopupPosition,	1✔
6	TargetRect,	1✔
7	} from '../models/popup.model';	1✔
8		1✔
9	type PopupPlaceholderProps = {	1✔
10	id: string;	1✔
11	};	1✔
12		1✔
13	const getDirection: (x: number, y: number) => MouseMovementDirection = (	1✔
14	movX,	3✔
15	movY	3✔
16	) => {	3✔
17	// If the mouse movement is zero, return null	3✔
18	if (movX === 0 && movY === 0) {	3!
19	return null;	×
20	}	×
21		3✔
22	// Get the absolute value of the mouse movement in the X and Y axes	3✔
23	const absMovX = Math.abs(movX);	3✔
24	const absMovY = Math.abs(movY);	3✔
25		3✔
26	let direction = '';	3✔
27		3✔
28	// Determine the direction of the mouse movement	3✔
29	direction =	3✔
30	absMovX > absMovY	3!
31	? movX < 0	×
32	? 'left'	×
33	: 'right'	×
34	: movY < 0	3!
35	? 'up'	×
36	: 'down';	3✔
37		3✔
38	// Return the direction	3✔
39	return direction as MouseMovementDirection;	3✔
40	};	3✔
41		1✔
42	// eslint-disable-next-line @typescript-eslint/no-explicit-any	1✔
43	const styleobjectToCssText = (style: any) => {	1✔
44	return Object.keys(style).reduce((acc, key) => {	4✔
45	return `${acc}${key}:${style[key]};`;	12✔
46	}, '');	4✔
47	};	4✔
48		1✔
49	const getSelectionDiv = (	1✔
50	style: SelectionStyle = {	×
51	backgroundColor: 'rgba(0, 123, 255, 0.1)',	×
52	borderColor: 'rgba(0, 123, 255, 0.5)',	×
53	borderStyle: 'dotted',	×
54	borderWidth: 1,	×
55	}	×
56	) => {	×
57	const span = document.createElement('span');	×
58	const { backgroundColor, borderColor, borderStyle, borderWidth } = style;	×
59	span.style.cssText = styleobjectToCssText({	×
60	position: 'absolute',	×
61	zIndex: 99999,	×
62	display: 'block',	×
63	background: backgroundColor,	×
64	border: `${borderWidth}px ${borderStyle} ${borderColor}`,	×
65	});	×
66		×
67	return span;	×
68	};	×
69		1✔
70	const getPointerImageWrapperDiv = () => {	1✔
71	const imageWrapper = document.createElement('span');	2✔
72	imageWrapper.style.cssText = styleobjectToCssText({	2✔
73	position: 'absolute',	2✔
74	display: 'block',	2✔
75	width: '100%',	2✔
76	height: '100%',	2✔
77	});	2✔
78		2✔
79	return imageWrapper;	2✔
80	};	2✔
81		1✔
82	const isTagTypeSpecial = (el: HTMLElement) => {	1✔
83	const { tagName } = el;	×
84	return (	×
85	tagName === 'INPUT' \|\|	×
86	tagName === 'TEXTAREA' \|\|	×
87	tagName === 'BUTTON' \|\|	×
88	tagName === 'A'	×
89	);	×
90	};	×
91		1✔
92	/**	1✔
93	* Creates a placeholder element for a popup component.	1✔
94	* @param {PopupPlaceholderProps} props - The props object containing the id, target, height, width, and position of the popup.	1✔
95	* @returns {HTMLDivElement} - The created placeholder element.	1✔
96	*/	1✔
97	const createPopupPlaceholder = ({	1✔
98	id,	2✔
99	}: PopupPlaceholderProps): HTMLDivElement => {	2✔
100	// const targetRect = target.getBoundingClientRect();	2✔
101		2✔
102	// Create the placeholder element	2✔
103	const placeholder = document.createElement('div');	2✔
104	placeholder.id = id;	2✔
105	placeholder.style.cssText = styleobjectToCssText({	2✔
106	position: 'fixed',	2✔
107	zIndex: '9999',	2✔
108	});	2✔
109	return placeholder;	2✔
110	};	2✔
111		1✔
112	const getAllHtmlAttrValues: (props: {	1✔
113	ele: HTMLElement;	1✔
114	names: string[];	1✔
115	}) => (string \| null)[] = ({ ele, names }) => {	1✔
116	if (ele) {	×
117	return names.map((name) => ele.getAttribute(`data-${name}`));	×
118	} else {	×
119	return [];	×
120	}	×
121	};	×
122		1✔
123	export {	1✔
124	createPopupPlaceholder,	1✔
125	getAllHtmlAttrValues,	1✔
126	getDirection,	1✔
127	getPointerImageWrapperDiv,	1✔
128	getSelectionDiv,	1✔
129	isTagTypeSpecial,	1✔
130	styleobjectToCssText,	1✔
131	};	1✔
132		1✔
133	// Helper function to calculate popup position	1✔
134	export function calculatePopupPosition(	1✔
135	position: PopupPosition,	2✔
136	targetRect: TargetRect,	2✔
137	dimensions: PopupDimensions,	2✔
138	popupGap: number	2✔
139	): { top: number; left: number } {	2✔
140	let left = 0;	2✔
141	let top = 0;	2✔
142	const { x, y, width: targetWidth, height: targetHeight } = targetRect;	2✔
143		2✔
144	// Calculate the popup position	2✔
145	switch (position) {	2✔
146	case 'top':	2!
147	top = y - dimensions.height;	×
148	break;	×
149	case 'bottom':	2✔
150	top = y + targetHeight;	2✔
151	break;	2✔
152	case 'left':	2!
153	left = x - dimensions.width - popupGap;	×
154	break;	×
155	case 'right':	2!
156	left = x + targetWidth + popupGap;	×
157	break;	×
158	default:	2!
NEW 159	break;	×
160	}	2✔
161		2✔
162	// Center the popup horizontally for top and bottom positions	2✔
163	if (position === 'top' \|\| position === 'bottom') {	2✔
164	left = x + targetWidth / 2 - dimensions.width / 2;	2✔
165	}	2✔
166		2✔
167	// Center the popup vertically for left and right positions	2✔
168	if (position === 'left' \|\| position === 'right') {	2!
169	top = y + targetHeight / 2 - dimensions.height / 2;	×
170	}	×
171		2✔
172	return { top, left };	2✔
173	}	2✔

prabhuignoto / react-pointer-plus / 6768993966

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