Skip to content

Commit

Permalink
Merge branch 'master' into pr/9336
Browse files Browse the repository at this point in the history
  • Loading branch information
ShaMan123 committed Sep 28, 2023
2 parents 5f0b627 + 228d552 commit 1ca7a0e
Show file tree
Hide file tree
Showing 78 changed files with 1,040 additions and 522 deletions.
9 changes: 9 additions & 0 deletions .eslintrc.js
Original file line number Diff line number Diff line change
Expand Up @@ -36,6 +36,7 @@ module.exports = {
],
'no-restricted-syntax': [
'error',
// explore how to define the selector: https://astexplorer.net/
{
selector: '[callee.object.name="Math"][callee.property.name="hypot"]',
message:
Expand All @@ -46,6 +47,14 @@ module.exports = {
message:
'Aliasing or destructing `Math` is not allowed due to restrictions on `Math.hypot` usage.',
},
{
selector: '[callee.object.name="console"]',
message: 'Use the `log` util',
},
{
selector: 'NewExpression[callee.name="Error"]',
message: 'Use `FabricError`',
},
],
},
};
2 changes: 1 addition & 1 deletion .github/workflows/tests.yml
Original file line number Diff line number Diff line change
Expand Up @@ -79,7 +79,7 @@ jobs:
# For more information see:
# https://help.github.com/actions/language-and-framework-guides/using-nodejs-with-github-actions
# supported Node.js release schedule: https://nodejs.org/en/about/releases/
node-version: [14.x, 16.x, 20.x]
node-version: [16.x, 20.x]
suite: [unit, visual]
steps:
- uses: actions/checkout@v3
Expand Down
14 changes: 14 additions & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,20 @@

## [next]

- fix(Canvas): invalidate `_objectsToRender` on stack change [#9387](https://github.com/fabricjs/fabric.js/pull/9387)
- ci(e2e): fix babel compiling error [#9388](https://github.com/fabricjs/fabric.js/pull/9388)
- Breaking: Remove node 14 [#9383](https://github.com/fabricjs/fabric.js/pull/9383)
- chore(): Rename exports that conflicts with JS/WEB api ( Object, Text, Image ). Kept backward compatibility with deprecation notice [#9172](https://github.com/fabricjs/fabric.js/pull/9172)
- fix(Geometry): `containsPoint` [#9372](https://github.com/fabricjs/fabric.js/pull/9372)
**BREAKING**:
- `Canvas#_checkTarget(point, object, pointFromViewport)` => `Canvas#_checkTarget(object, pointFromViewport)`
- fix(Canvas): avoid firing event twice when working with nested objects [#9329](https://github.com/fabricjs/fabric.js/pull/9329)
- fix(Control): `calcCornerCoords` angle + calculation [#9377](https://github.com/fabricjs/fabric.js/pull/9377)
- patch(): dep findCrossPoints in favor of `isPointInPolygon` [#9374](https://github.com/fabricjs/fabric.js/pull/9374)
- docs() enable typedocs to run again [#9356](https://github.com/fabricjs/fabric.js/pull/9356)
- chore(): cleanup logs and error messages [#9369](https://github.com/fabricjs/fabric.js/pull/9369)
- feature(Object) BREAKING: Remove lines parameter from object.containsPoint [#9375](https://github.com/fabricjs/fabric.js/pull/9375)
- patch(Control): move hit detection to shouldActivate [#9374](https://github.com/fabricjs/fabric.js/pull/9374)
- fix(StaticCanvas): disposing animations [#9361](https://github.com/fabricjs/fabric.js/pull/9361)
- fix(IText): cursor width under group [#9341](https://github.com/fabricjs/fabric.js/pull/9341)
- TS(Canvas): constructor optional el [#9348](https://github.com/fabricjs/fabric.js/pull/9348)
Expand Down
18 changes: 9 additions & 9 deletions CONTRIBUTING.md
Original file line number Diff line number Diff line change
Expand Up @@ -129,15 +129,15 @@ It is more than likely you will be requested to change stuff and refine your wor
[![🧪](../../actions/workflows/tests.yml/badge.svg)](../../actions/workflows/tests.yml)
[![CodeQL](../../actions/workflows/codeql-analysis.yml/badge.svg)](../../actions/workflows/codeql-analysis.yml)

| Suite | unit (node) | e2e (browser) |
| ---------------------------------------------------------------------------- | :------------------------------------------------------------------------------------------------------- | :------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| Framework | [`jest`][jest] | [`playwright`][playwright] |
| Setup | | <pre>npm run build -- -f -w</pre> |
| Running Tests<br><br><br><br><br><pre>\<test cmd\> -- [filter] [watch]</pre> | <pre>npm run test:jest -- [filters] [-w]</pre><br><br><br>It is advised to use filters to save time.<br> | <pre>npm run test:e2e -- [filters] [--ui]</pre><br>In some machines babel is flaky and doesn't build the test files. In that is the case, try running the command using `npx` directly, see [`playwright.setup.ts`](./playwright.setup.ts). |
| Writing Tests | Add/update `src/*.(spec\|test).ts` files | - Update tests in `e2e/tests`<br>- Create a new test based on `e2e/template` |
| Test Gen | | <pre>npm start vanilla<br>npx playwright codegen http://localhost:1234</pre> |
| Test Spec | | - `index.ts`: built and loaded into the web app<br> - `index.spec.ts`: test spec<br> |
| Outputs | Snapshots next to the test file | - Snapshots next to the test file <br>- `e2e/test-report`<br>- `e2e/test-results` |
| Suite | unit (node) | e2e (browser) |
| ------------------------------------------------------------------------------------------------------------- | :--------------------------------------------- | :----------------------------------------------------------------------------------- |
| Framework | [`jest`][jest] | [`playwright`][playwright] |
| Setup | | <pre>npm run build -- -f -w</pre> |
| Running Tests<br><br><pre>\<test cmd\> -- [filter] [watch]</pre><br>It is advised to use filters to save time | <pre>npm run test:jest -- [filters] [-w]</pre> | <pre>npm run test:e2e -- [filters] [--ui]</pre> |
| Writing Tests | Add/update `src/*.(spec\|test).ts` files | - Update tests in `e2e/tests`<br>- Create a new test based on `e2e/template` |
| Test Gen | | <pre>npm start vanilla<br>npx playwright codegen http://localhost:1234</pre> |
| Test Spec | | - `index.ts`: built and loaded into the web app<br> - `index.spec.ts`: test spec<br> |
| Outputs | Snapshots next to the test file | - Snapshots next to the test file <br>- `e2e/test-report`<br>- `e2e/test-results` |

### Legacy Test Suite

Expand Down
27 changes: 27 additions & 0 deletions e2e/tests/controls/hit-regions/index.spec.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
import { expect, test } from '@playwright/test';
import setup from '../../../setup';
import { CanvasUtil } from '../../../utils/CanvasUtil';

setup();

test('Control hit regions', async ({ page }) => {
const canvasUtil = new CanvasUtil(page);
await canvasUtil.executeInBrowser((canvas) => {
const rect = canvas.getActiveObject();
const render = ({ x, y }: fabric.Point, fill: string) => {
const ctx = canvas.getTopContext();
ctx.fillStyle = fill;
ctx.beginPath();
ctx.arc(x, y, 1, 0, Math.PI * 2);
ctx.fill();
};
for (let y = 0; y <= canvas.height; y++) {
for (let x = 0; x < canvas.width; x++) {
const point = new fabric.Point(x, y);
rect._findTargetCorner(point, true) && render(point, 'indigo');
rect._findTargetCorner(point) && render(point, 'magenta');
}
}
});
expect(await new CanvasUtil(page).screenshot()).toMatchSnapshot();
});
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
40 changes: 40 additions & 0 deletions e2e/tests/controls/hit-regions/index.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,40 @@
/**
* Runs in the **BROWSER**
* Imports are defined in 'e2e/imports.ts'
*/

import * as fabric from 'fabric';
import { beforeAll } from '../../test';

beforeAll((canvas) => {
canvas.setDimensions({ width: 300, height: 325 });
const controls = fabric.controlsUtils.createObjectDefaultControls();
Object.values(controls).forEach((control) => {
control.sizeX = 20;
control.sizeY = 25;
control.touchSizeX = 30;
control.touchSizeY = 35;
});
const rect = new fabric.Rect({
left: 25,
top: 60,
width: 75,
height: 100,
controls,
scaleY: 2,
fill: 'blue',
padding: 10,
});
const group = new fabric.Group([rect], {
angle: 30,
scaleX: 2,
interactive: true,
subTargetCheck: true,
});
canvas.add(group);
canvas.centerObject(group);
group.setCoords();
canvas.setActiveObject(rect);
canvas.renderAll();
return { rect, group };
});
2 changes: 1 addition & 1 deletion e2e/utils/CanvasUtil.ts
Original file line number Diff line number Diff line change
Expand Up @@ -33,7 +33,7 @@ export class CanvasUtil {

async executeInBrowser<C, R>(
runInBrowser: (canvas: Canvas, context: C) => R,
context: C
context?: C
): Promise<R> {
return (
await this.page.evaluateHandle<Canvas>(
Expand Down
10 changes: 7 additions & 3 deletions fabric.ts
Original file line number Diff line number Diff line change
Expand Up @@ -41,7 +41,11 @@ export { CircleBrush } from './src/brushes/CircleBrush';
export { SprayBrush } from './src/brushes/SprayBrush';
export { PatternBrush } from './src/brushes/PatternBrush';

export { FabricObject as Object } from './src/shapes/Object/FabricObject';
export {
FabricObject,
_Object as Object,
} from './src/shapes/Object/FabricObject';

export type {
TFabricObjectProps,
FabricObjectProps,
Expand Down Expand Up @@ -71,7 +75,7 @@ export type {
TPathSide,
TextProps,
} from './src/shapes/Text/Text';
export { Text } from './src/shapes/Text/Text';
export { Text, FabricText } from './src/shapes/Text/Text';
export type {
ITextProps,
SerializedITextProps,
Expand Down Expand Up @@ -104,7 +108,7 @@ export type {
MultiSelectionStacking,
} from './src/shapes/ActiveSelection';
export { ActiveSelection } from './src/shapes/ActiveSelection';
export { Image } from './src/shapes/Image';
export { Image, FabricImage } from './src/shapes/Image';
export type {
ImageSource,
SerializedImageProps,
Expand Down
4 changes: 3 additions & 1 deletion jest.extend.ts
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ type ObjectOptions<T = unknown> = ExtendedOptions<T> & {
};

export const roundSnapshotOptions = {
cloneDeepWith: (value) => {
cloneDeepWith: (value: any) => {
if (typeof value === 'number') {
return Math.round(value);
}
Expand All @@ -23,6 +23,7 @@ export const roundSnapshotOptions = {

expect.extend({
toMatchSnapshot(
this: any,
received: any,
propertiesOrHint?: ExtendedOptions,
hint?: string
Expand All @@ -43,6 +44,7 @@ expect.extend({
);
},
toMatchObjectSnapshot(
this: any,
received: FabricObject | Record<string, any>,
{
cloneDeepWith: customizer,
Expand Down
73 changes: 21 additions & 52 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

Loading

0 comments on commit 1ca7a0e

Please sign in to comment.