Merge pull request #21 from PhiLhoSoft/aphrodite-no-important

Add aphrodite-no-important case

Author: PepijnSenders

README.md

@@ -176,9 +176,9 @@ Some observations:
 
 For all of them, class name is stable between generations if same content. Unless said otherwise, the generated CSS is minimized.
 
-#### aphrodite
+#### aphrodite and aphrodite-no-important
 
-(simple) Removes a non-used class. Generates class names like `original-name_1fm03kj`. Adds `!important` to each CSS property, but this can be deactivated.
+(simple) Removes a non-used class. Generates class names like `original-name_1fm03kj`. By default, adds `!important` to each CSS property, *aphrodite-no-important* generates CSS without it.
 (style overload) Different classes with a common style are kept as is.
 (classes overload) Doesn't detect identical classes that remain duplicate.
 (nested) Manages pseudo-classes and media queries.

src/classes-overload-test/cases/aphrodite-no-important.js

@@ -0,0 +1,17 @@
+import { StyleSheet, css as aphroditeCss, StyleSheetServer, StyleSheetTestUtils } from 'aphrodite/no-important';
+import { stylesheet, buttonClassNames } from '../styles';
+import { renderHtml, renderBody } from '../render';
+
+export const aphroditeNoImportantCase = (caseName) => {
+    const useStyles = StyleSheet.create(stylesheet);
+
+    const getButtonClassName = i => aphroditeCss(useStyles[buttonClassNames[i]]);
+
+    const { html, css } = StyleSheetServer.renderStatic(() => {
+        return renderBody(caseName, aphroditeCss(useStyles.container), getButtonClassName);
+    });
+
+    StyleSheetTestUtils.clearBufferAndResumeStyleInjection();
+
+    return renderHtml(css.content, html);
+};

src/classes-overload-test/cases/index.js

@@ -1,4 +1,5 @@
 export * from './aphrodite';
+export * from './aphrodite-no-important';
 export * from './cxs';
 export * from './cxs-optimized';
 export * from './fela';

src/nested-test/cases/aphrodite-no-important.js

@@ -0,0 +1,19 @@
+import { StyleSheet, css as aphroditeCss, StyleSheetServer, StyleSheetTestUtils } from 'aphrodite/no-important';
+import { createStylesheet } from '../styles';
+import { renderHtml, renderBody } from '../render';
+
+export const aphroditeNoImportantCase = (caseName) => {
+    const useStyles = StyleSheet.create(createStylesheet());
+
+    const { html, css } = StyleSheetServer.renderStatic(() =>
+        renderBody(
+            caseName,
+            aphroditeCss(useStyles.container),
+            aphroditeCss(useStyles.button)
+        )
+    );
+
+    StyleSheetTestUtils.clearBufferAndResumeStyleInjection();
+
+    return renderHtml(css.content, html);
+};

src/nested-test/cases/index.js

@@ -1,4 +1,5 @@
 export * from './aphrodite';
+export * from './aphrodite-no-important';
 export * from './cxs';
 export * from './cxs-optimized';
 export * from './fela';

src/simple-test/cases/aphrodite-no-important.js

@@ -0,0 +1,19 @@
+import { StyleSheet, css as aphroditeCss, StyleSheetServer, StyleSheetTestUtils } from 'aphrodite/no-important';
+import { stylesheet } from '../styles';
+import { renderHtml, renderBody } from '../render';
+
+export const aphroditeNoImportantCase = (caseName) => {
+    const useStyles = StyleSheet.create(stylesheet);
+
+    const { html, css } = StyleSheetServer.renderStatic(() =>
+        renderBody(
+            caseName,
+            aphroditeCss(useStyles.container),
+            aphroditeCss(useStyles.button)
+        )
+    );
+
+    StyleSheetTestUtils.clearBufferAndResumeStyleInjection();
+
+    return renderHtml(css.content, html);
+};

src/simple-test/cases/index.js

@@ -1,4 +1,5 @@
 export * from './aphrodite';
+export * from './aphrodite-no-important';
 export * from './cxs';
 export * from './cxs-optimized';
 export * from './fela';

src/size-test/aphrodite-no-important.js

@@ -0,0 +1 @@
+import aphrodite from 'aphrodite/no-important';

src/size-test/index.js

@@ -56,6 +56,7 @@ const testBundle = (name) => new Promise((resolve, reject) => {
 
 Promise.all([
     testBundle('aphrodite'),
+    testBundle('aphrodite-no-important'),
     testBundle('cxs'),
     testBundle('cxs-optimized'),
     testBundle('fela'),

src/size-test/jss-without-preset.js

@@ -1,2 +1,3 @@
 import jss from 'jss';
 import camelCase from 'jss-camel-case';
+import nested from 'jss-nested';