jest-emotion - npm Package Compare versions

Comparing version 10.0.0-really-unsafe-please-do-not-use.2 to 10.0.0

package.json

 {
   "name": "jest-emotion",
-  "version": "10.0.0-really-unsafe-please-do-not-use.2",
+  "version": "10.0.0",
   "description": "Jest utilities for emotion",
-  "main": "dist/index.cjs.js",
+  "main": "dist/jest-emotion.cjs.js",
   "types": "types/index.d.ts",
@@ -19,6 +19,8 @@ "files": [
     "chalk": "^2.4.1",
-    "css": "^2.2.1"
+    "css": "^2.2.1",
+    "object-assign": "^4.1.1"
   },
   "devDependencies": {
     "dtslint": "^0.3.0",
+    "emotion": "10.0.0",
     "preact": "^8.2.9",
@@ -44,9 +46,5 @@ "preact-render-to-json": "^3.6.6",
   },
-  "publishConfig": {
-    "tag": "next"
-  },
   "browser": {
-    "./dist/index.cjs.js": "./dist/index.browser.cjs.js"
-  },
-  "gitHead": "0da0de50f6f2c19e46bca7662d1a954d48db1264"
+    "./dist/jest-emotion.cjs.js": "./dist/jest-emotion.browser.cjs.js"
+  }
 }

README.md

@@ -81,19 +81,2 @@ # jest-emotion
 
-# getStyles
-
-jest-emotion also allows you to get all the css that emotion has inserted. This is meant to be an escape hatch if you don't use React or you want to build your own utilities for testing with emotion.
-
-```jsx
-import { css } from 'emotion'
-import { getStyles } from 'jest-emotion'
-
-test('correct styles are inserted', () => {
-  const cls = css`
-    display: flex;
-  `
-
-  expect(getStyles()).toMatchSnapshot()
-})
-```
-
 # Custom matchers
@@ -109,3 +92,3 @@
 import { matchers } from 'jest-emotion'
-import styled from 'react-emotion'
+import styled from '@emotion/styled'
 
@@ -112,0 +95,0 @@ // Add the custom matchers provided by 'jest-emotion'

src/utils.js

@@ -74,2 +74,6 @@ // @flow
 
+let keyframesPattern = /^@keyframes\s+(animation-[^{\s]+)+/
+
+let removeCommentPattern = /\/\*[\s\S]*?\*\//g
+
 export function getStylesFromClassNames(
@@ -95,4 +99,5 @@ classNames: Array<string>,
   let selectorPattern = new RegExp('\\.(' + filteredClassNames.join('|') + ')')
+  let keyframes = {}
+  let styles = ''
 
-  let styles = ''
   elements.forEach(element => {
@@ -103,5 +108,33 @@ let rule = element.textContent || ''
     }
+    let match = rule.match(keyframesPattern)
+    if (match !== null) {
+      let name = match[1]
+      if (keyframes[name] === undefined) {
+        keyframes[name] = ''
+      }
+      keyframes[name] += rule
+    }
   })
+  let keyframeNameKeys = Object.keys(keyframes)
+  let keyframesStyles = ''
 
-  return styles
+  if (keyframeNameKeys.length) {
+    let keyframesNamePattern = new RegExp(keyframeNameKeys.join('|'), 'g')
+    let keyframesNameCache = {}
+    let index = 0
+
+    styles = styles.replace(keyframesNamePattern, name => {
+      if (keyframesNameCache[name] === undefined) {
+        keyframesNameCache[name] = `animation-${index++}`
+        keyframesStyles += keyframes[name]
+      }
+      return keyframesNameCache[name]
+    })
+
+    keyframesStyles = keyframesStyles.replace(keyframesNamePattern, value => {
+      return keyframesNameCache[value]
+    })
+  }
+
+  return (keyframesStyles + styles).replace(removeCommentPattern, '')
 }
@@ -108,0 +141,0 @@

types/index.d.ts

@@ -5,19 +5,29 @@ // Definitions by: Junyoung Clare Jang <https://github.com/Ailrun>
 /// <reference types="jest" />
-import { Emotion } from 'create-emotion';
+export interface EmotionMatchers extends jest.ExpectExtendMap {
+  toHaveStyleRule(
+    received: any,
+    property: string,
+    value: any
+  ): { message(): string; pass: boolean }
+}
+export const matchers: EmotionMatchers
 
 export interface CreateSerializerOptions {
-  classNameReplacer?: (className: string, index: number) => string;
-  DOMElements?: boolean;
+  classNameReplacer?: (className: string, index: number) => string
+  DOMElements?: boolean
 }
+export function createSerializer(
+  options?: CreateSerializerOptions
+): jest.SnapshotSerializerPlugin
+export const print: jest.SnapshotSerializerPlugin['print']
+export const test: jest.SnapshotSerializerPlugin['test']
+declare const serializer: jest.SnapshotSerializerPlugin
+export default serializer
 
-export function getStyles(emotion: Emotion): string;
-export function createSerializer(emotion: Emotion, options?: CreateSerializerOptions): jest.SnapshotSerializerPlugin;
-export function createMatchers(emotion: Emotion): jest.ExpectExtendMap;
-
 declare global {
   namespace jest {
     interface Matchers<R> {
-      toHaveStyleRule(property: string, value: any): R;
+      toHaveStyleRule(property: string, value: any): R
     }
   }
 }

types/test.ts

@@ -1,52 +0,45 @@
-/// <reference types="jest" />
-import * as emotion from 'emotion';
-import {
+import serializer, {
+  matchers,
   CreateSerializerOptions,
   createSerializer,
-  createMatchers,
-  getStyles,
-} from '../';
+  print,
+  test
+} from 'jest-emotion'
 
-createSerializer(emotion);
-createSerializer(emotion, {});
-createSerializer(emotion, {
-  DOMElements: true,
-});
-createSerializer(emotion, {
+createSerializer()
+createSerializer({})
+createSerializer({
+  DOMElements: true
+})
+createSerializer({
   classNameReplacer() {
-    return 'abc';
-  },
-});
-createSerializer(emotion, {
+    return 'abc'
+  }
+})
+createSerializer({
   classNameReplacer(className) {
-    return className;
-  },
-});
-createSerializer(emotion, {
+    return className
+  }
+})
+createSerializer({
   classNameReplacer(className, index) {
-    return `${className}-${index}`;
-  },
-});
-createSerializer(emotion, 213 as any as CreateSerializerOptions);
+    return `${className}-${index}`
+  }
+})
+createSerializer((213 as any) as CreateSerializerOptions)
 // $ExpectError
-createSerializer();
+createSerializer(1)
 // $ExpectError
-createSerializer(emotion, 1);
+createSerializer(true)
 // $ExpectError
-createSerializer(emotion, true);
-// $ExpectError
-createSerializer(emotion, {}, undefined as any);
+createSerializer({}, undefined as any)
 
-// $ExpectError
-createMatchers();
-// $ExpectError
-createMatchers(emotion, undefined as any);
+expect.addSnapshotSerializer(serializer)
+expect.addSnapshotSerializer(createSerializer())
+expect.extend(matchers)
 
-expect.addSnapshotSerializer(createSerializer(emotion));
-expect.extend(createMatchers(emotion));
-
-expect({}).toHaveStyleRule('width', 'black');
-expect({}).toHaveStyleRule('height', /red/);
-expect({}).toHaveStyleRule('color', expect.stringContaining('20'));
+expect({}).toHaveStyleRule('width', 'black')
+expect({}).toHaveStyleRule('height', /red/)
+expect({}).toHaveStyleRule('color', expect.stringContaining('20'))
 // $ExpectError
-expect({}).toHaveStyleRule(5, 'abc');
+expect({}).toHaveStyleRule(5, 'abc')

types/tslint.json

 {
     "extends": "dtslint/dtslint.json",
     "rules": {
-        "no-relative-import-in-test": false
+        "array-type": [
+            true,
+            "generic"
+        ],
+        "semicolon": false
     }
 }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

52959

increased by29.48%

Lines of code

1488

increased by35.03%

Number of low quality alerts

0

decreased by-100%

Worsened metrics

Dependency count

4

increased by33.33%

Dev dependency count

5

increased by25%

Number of lines in readme file

111

decreased by-13.28%

Number of medium supply chain risk alerts

1

increased byInfinity%

Dependency changes

• + Addedobject-assign@^4.1.1

• + Addedobject-assign@4.1.1(transitive)