@fluentui-react-native/use-tokens 0.6.0 → 0.6.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.json +16 -1
- package/CHANGELOG.md +10 -2
- package/lib/useTokens.samples.test.js +15 -18
- package/lib/useTokens.samples.test.js.map +1 -1
- package/lib-commonjs/useTokens.samples.test.js +15 -18
- package/lib-commonjs/useTokens.samples.test.js.map +1 -1
- package/package.json +3 -3
- package/src/__snapshots__/useTokens.samples.test.tsx.snap +55 -135
- package/src/useTokens.samples.test.tsx +23 -27
package/CHANGELOG.json
CHANGED
|
@@ -2,7 +2,22 @@
|
|
|
2
2
|
"name": "@fluentui-react-native/use-tokens",
|
|
3
3
|
"entries": [
|
|
4
4
|
{
|
|
5
|
-
"date": "
|
|
5
|
+
"date": "Wed, 29 Jan 2025 23:39:17 GMT",
|
|
6
|
+
"version": "0.6.2",
|
|
7
|
+
"tag": "@fluentui-react-native/use-tokens_v0.6.2",
|
|
8
|
+
"comments": {
|
|
9
|
+
"patch": [
|
|
10
|
+
{
|
|
11
|
+
"author": "sanajmi@microsoft.com",
|
|
12
|
+
"package": "@fluentui-react-native/use-tokens",
|
|
13
|
+
"commit": "5ca24ac45054439768404d117213a2ae4767235d",
|
|
14
|
+
"comment": "remove enzyme tests"
|
|
15
|
+
}
|
|
16
|
+
]
|
|
17
|
+
}
|
|
18
|
+
},
|
|
19
|
+
{
|
|
20
|
+
"date": "Thu, 11 Apr 2024 18:08:40 GMT",
|
|
6
21
|
"version": "0.6.0",
|
|
7
22
|
"tag": "@fluentui-react-native/use-tokens_v0.6.0",
|
|
8
23
|
"comments": {
|
package/CHANGELOG.md
CHANGED
|
@@ -1,12 +1,20 @@
|
|
|
1
1
|
# Change Log - @fluentui-react-native/use-tokens
|
|
2
2
|
|
|
3
|
-
This log was last generated on
|
|
3
|
+
<!-- This log was last generated on Wed, 29 Jan 2025 23:39:17 GMT and should not be manually modified. -->
|
|
4
4
|
|
|
5
5
|
<!-- Start content -->
|
|
6
6
|
|
|
7
|
+
## 0.6.2
|
|
8
|
+
|
|
9
|
+
Wed, 29 Jan 2025 23:39:17 GMT
|
|
10
|
+
|
|
11
|
+
### Patches
|
|
12
|
+
|
|
13
|
+
- remove enzyme tests (sanajmi@microsoft.com)
|
|
14
|
+
|
|
7
15
|
## 0.6.0
|
|
8
16
|
|
|
9
|
-
Thu, 11 Apr 2024 18:
|
|
17
|
+
Thu, 11 Apr 2024 18:08:40 GMT
|
|
10
18
|
|
|
11
19
|
### Minor changes
|
|
12
20
|
|
|
@@ -3,8 +3,7 @@ import * as React from 'react';
|
|
|
3
3
|
import { Text, View } from 'react-native';
|
|
4
4
|
import { immutableMerge } from '@fluentui-react-native/immutable-merge';
|
|
5
5
|
import { mergeStyles } from '@fluentui-react-native/merge-props';
|
|
6
|
-
import
|
|
7
|
-
import toJson from 'enzyme-to-json';
|
|
6
|
+
import * as renderer from 'react-test-renderer';
|
|
8
7
|
import { buildUseTokens } from './buildUseTokens';
|
|
9
8
|
/**
|
|
10
9
|
* The default/base theme just contains base values
|
|
@@ -24,12 +23,6 @@ var useTheme = function () { return current.theme; };
|
|
|
24
23
|
var setActiveTheme = function (theme) {
|
|
25
24
|
current.theme = (theme && immutableMerge(baseTheme, theme)) || baseTheme;
|
|
26
25
|
};
|
|
27
|
-
/**
|
|
28
|
-
* this wrapper solves the (so-far) inexplicable type errors from the matchers in typescript
|
|
29
|
-
*/
|
|
30
|
-
function snapshotTestTree(tree) {
|
|
31
|
-
expect(toJson(tree)).toMatchSnapshot();
|
|
32
|
-
}
|
|
33
26
|
/**
|
|
34
27
|
* Helper function used to look up a component in the theme. Having this injected allows this module to not be dependent on the shape of
|
|
35
28
|
* the theme used.
|
|
@@ -86,8 +79,8 @@ describe('useTokens samples', function () {
|
|
|
86
79
|
});
|
|
87
80
|
/** first render the component with no updates */
|
|
88
81
|
it('Sample1Text rendering with no overrides', function () {
|
|
89
|
-
var tree =
|
|
90
|
-
|
|
82
|
+
var tree = renderer.create(React.createElement(SampleText1, null, "Sample1a")).toJSON();
|
|
83
|
+
expect(tree).toMatchSnapshot();
|
|
91
84
|
});
|
|
92
85
|
/** now re-theme the component via the components in the theme */
|
|
93
86
|
it('Sample1Text rendering with some custom settings in the theme', function () {
|
|
@@ -99,8 +92,8 @@ describe('useTokens samples', function () {
|
|
|
99
92
|
},
|
|
100
93
|
},
|
|
101
94
|
});
|
|
102
|
-
var tree =
|
|
103
|
-
|
|
95
|
+
var tree = renderer.create(React.createElement(SampleText1, null, "Sample1b")).toJSON();
|
|
96
|
+
expect(tree).toMatchSnapshot();
|
|
104
97
|
});
|
|
105
98
|
// the Sample2Text component is built the same way as sample1, just using the new hook that has been created
|
|
106
99
|
var SampleText2 = function (props) {
|
|
@@ -120,10 +113,12 @@ describe('useTokens samples', function () {
|
|
|
120
113
|
};
|
|
121
114
|
/** rendering the Sample2 component with the base theme */
|
|
122
115
|
it('Sample2Text rendering with defaults and a color override', function () {
|
|
123
|
-
var tree =
|
|
116
|
+
var tree = renderer
|
|
117
|
+
.create(React.createElement(View, null,
|
|
124
118
|
React.createElement(SampleText2, null, "Sample2 with defaults"),
|
|
125
|
-
React.createElement(SampleText2, { color: "green" }, "Sample2 with color override via prop")))
|
|
126
|
-
|
|
119
|
+
React.createElement(SampleText2, { color: "green" }, "Sample2 with color override via prop")))
|
|
120
|
+
.toJSON();
|
|
121
|
+
expect(tree).toMatchSnapshot();
|
|
127
122
|
});
|
|
128
123
|
/** now re-theme the component via the components in the theme */
|
|
129
124
|
it('Sample2Text rendering with some custom settings in the theme', function () {
|
|
@@ -135,10 +130,12 @@ describe('useTokens samples', function () {
|
|
|
135
130
|
},
|
|
136
131
|
},
|
|
137
132
|
});
|
|
138
|
-
var tree =
|
|
133
|
+
var tree = renderer
|
|
134
|
+
.create(React.createElement(View, null,
|
|
139
135
|
React.createElement(SampleText2, null, "Sample2 with theme overrides set"),
|
|
140
|
-
React.createElement(SampleText2, { color: "purple" }, "Sample2 with theme and color prop override")))
|
|
141
|
-
|
|
136
|
+
React.createElement(SampleText2, { color: "purple" }, "Sample2 with theme and color prop override")))
|
|
137
|
+
.toJSON();
|
|
138
|
+
expect(tree).toMatchSnapshot();
|
|
142
139
|
});
|
|
143
140
|
});
|
|
144
141
|
//# sourceMappingURL=useTokens.samples.test.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useTokens.samples.test.js","sourceRoot":"","sources":["../src/useTokens.samples.test.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAE1C,OAAO,EAAE,cAAc,EAAE,MAAM,wCAAwC,CAAC;AACxE,OAAO,EAAE,WAAW,EAAE,MAAM,oCAAoC,CAAC;AACjE,OAAO,
|
|
1
|
+
{"version":3,"file":"useTokens.samples.test.js","sourceRoot":"","sources":["../src/useTokens.samples.test.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAE1C,OAAO,EAAE,cAAc,EAAE,MAAM,wCAAwC,CAAC;AACxE,OAAO,EAAE,WAAW,EAAE,MAAM,oCAAoC,CAAC;AACjE,OAAO,KAAK,QAAQ,MAAM,qBAAqB,CAAC;AAEhD,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAuBlD;;GAEG;AACH,IAAM,SAAS,GAAU;IACvB,OAAO,EAAE;QACP,eAAe,EAAE,OAAO;QACxB,KAAK,EAAE,OAAO;QACd,WAAW,EAAE,MAAM;QACnB,UAAU,EAAE,OAAO;QACnB,QAAQ,EAAE,EAAE;KACb;IACD,UAAU,EAAE,EAAE;CACf,CAAC;AAEF,IAAM,OAAO,GAAG,EAAE,KAAK,EAAE,SAAS,EAAE,CAAC;AAErC,IAAM,QAAQ,GAAG,cAAM,OAAA,OAAO,CAAC,KAAK,EAAb,CAAa,CAAC;AAErC,IAAM,cAAc,GAAG,UAAC,KAAsB;IAC5C,OAAO,CAAC,KAAK,GAAG,CAAC,KAAK,IAAI,cAAc,CAAQ,SAAS,EAAE,KAAc,CAAC,CAAC,IAAI,SAAS,CAAC;AAC3F,CAAC,CAAC;AAEF;;;GAGG;AACH,IAAM,gBAAgB,GAAG,UAAC,KAAY,EAAE,IAAY,IAAK,OAAA,KAAK,CAAC,UAAU,CAAC,IAAI,CAAC,EAAtB,CAAsB,CAAC;AAEhF,QAAQ,CAAC,mBAAmB,EAAE;IAC5B;;;;;OAKG;IASH,IAAM,gBAAgB,GAAG,cAAc,CACrC,gBAAgB;IAChB,yEAAyE;IACzE,UAAC,CAAQ,IAAK,OAAA,CAAC;QACb,KAAK,EAAE,CAAC,CAAC,OAAO,CAAC,KAAK;QACtB,UAAU,EAAE,CAAC,CAAC,OAAO,CAAC,UAAU;QAChC,QAAQ,EAAE,CAAC,CAAC,OAAO,CAAC,QAAQ;KAC7B,CAAC,EAJY,CAIZ;IACF,+DAA+D;IAC/D,YAAY,CACb,CAAC;IAEF,IAAM,WAAW,GAAuC,UAAC,KAAK;QAC5D,2BAA2B;QACnB,IAAA,KAAK,GAAwB,KAAK,MAA7B,EAAE,QAAQ,GAAc,KAAK,SAAnB,EAAK,IAAI,UAAK,KAAK,EAApC,qBAA4B,CAAF,CAAW;QAE3C,mHAAmH;QACnH,IAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;QAEzB,+GAA+G;QAC/G,gDAAgD;QAC1C,IAAA,KAAkB,gBAAgB,CAAC,KAAK,CAAC,EAAxC,MAAM,QAAA,EAAE,KAAK,QAA2B,CAAC;QAEhD,4DAA4D;QAC5D,IAAM,eAAe,GAAG,KAAK;QAC3B;;;;WAIG;QACH,cAAM,OAAA,cAAM,MAAM,EAAG,EAAf,CAAe;QACrB;;;;;;WAMG;QACH,EAAE,CACH,CAAC;QAEF,mHAAmH;QACnH,kGAAkG;QAClG,IAAM,WAAW,GAAG,WAAW,CAAC,eAAe,EAAE,KAAK,CAAC,CAAC;QAExD,wHAAwH;QACxH,OAAO,CACL,oBAAC,IAAI,eAAK,IAAI,IAAE,KAAK,EAAE,WAAW,KAC/B,QAAQ,CACJ,CACR,CAAC;IACJ,CAAC,CAAC;IAEF,UAAU,CAAC;QACT,cAAc,EAAE,CAAC;IACnB,CAAC,CAAC,CAAC;IAEH,iDAAiD;IACjD,EAAE,CAAC,yCAAyC,EAAE;QAC5C,IAAM,IAAI,GAAG,QAAQ,CAAC,MAAM,CAAC,oBAAC,WAAW,mBAAuB,CAAC,CAAC,MAAM,EAAE,CAAC;QAC3E,MAAM,CAAC,IAAI,CAAC,CAAC,eAAe,EAAE,CAAC;IACjC,CAAC,CAAC,CAAC;IAEH,iEAAiE;IACjE,EAAE,CAAC,8DAA8D,EAAE;QACjE,cAAc,CAAC;YACb,UAAU,EAAE;gBACV,UAAU,EAAE;oBACV,KAAK,EAAE,MAAM;oBACb,QAAQ,EAAE,EAAE;iBACb;aACF;SACF,CAAC,CAAC;QACH,IAAM,IAAI,GAAG,QAAQ,CAAC,MAAM,CAAC,oBAAC,WAAW,mBAAuB,CAAC,CAAC,MAAM,EAAE,CAAC;QAC3E,MAAM,CAAC,IAAI,CAAC,CAAC,eAAe,EAAE,CAAC;IACjC,CAAC,CAAC,CAAC;IAUH,4GAA4G;IAC5G,IAAM,WAAW,GAA0C,UAAC,KAAK;QACvD,IAAA,KAAK,GAA+B,KAAK,MAApC,EAAE,KAAK,GAAwB,KAAK,MAA7B,EAAE,QAAQ,GAAc,KAAK,SAAnB,EAAK,IAAI,UAAK,KAAK,EAA3C,8BAAmC,CAAF,CAAW;QAClD,IAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;QAEzB,uGAAuG;QACjG,IAAA,KAAkB,gBAAgB,CAAC,KAAK,CAAC,EAAxC,MAAM,QAAA,EAAE,KAAK,QAA2B,CAAC;QAEhD,mHAAmH;QACnH,8GAA8G;QAC9G,IAAM,eAAe,GAAG,KAAK;QAC3B,kIAAkI;QAClI,cAAM,OAAA,uBAAM,MAAM,GAAK,CAAC,KAAK,IAAI,EAAE,KAAK,OAAA,EAAE,CAAC,EAAG,EAAxC,CAAwC;QAC9C,mDAAmD;QACnD,CAAC,KAAK,CAAC,CACR,CAAC;QAEF,4EAA4E;QAC5E,OAAO,CACL,oBAAC,IAAI,eAAK,IAAI,IAAE,KAAK,EAAE,WAAW,CAAC,eAAe,EAAE,KAAK,CAAC,KACvD,QAAQ,CACJ,CACR,CAAC;IACJ,CAAC,CAAC;IAEF,0DAA0D;IAC1D,EAAE,CAAC,0DAA0D,EAAE;QAC7D,IAAM,IAAI,GAAG,QAAQ;aAClB,MAAM,CACL,oBAAC,IAAI;YACH,oBAAC,WAAW,gCAAoC;YAChD,oBAAC,WAAW,IAAC,KAAK,EAAC,OAAO,2CAAmD,CACxE,CACR;aACA,MAAM,EAAE,CAAC;QACZ,MAAM,CAAC,IAAI,CAAC,CAAC,eAAe,EAAE,CAAC;IACjC,CAAC,CAAC,CAAC;IAEH,iEAAiE;IACjE,EAAE,CAAC,8DAA8D,EAAE;QACjE,cAAc,CAAC;YACb,UAAU,EAAE;gBACV,UAAU,EAAE;oBACV,QAAQ,EAAE,EAAE;oBACZ,UAAU,EAAE,WAAW;iBACxB;aACF;SACF,CAAC,CAAC;QACH,IAAM,IAAI,GAAG,QAAQ;aAClB,MAAM,CACL,oBAAC,IAAI;YACH,oBAAC,WAAW,2CAA+C;YAC3D,oBAAC,WAAW,IAAC,KAAK,EAAC,QAAQ,iDAAyD,CAC/E,CACR;aACA,MAAM,EAAE,CAAC;QACZ,MAAM,CAAC,IAAI,CAAC,CAAC,eAAe,EAAE,CAAC;IACjC,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC"}
|
|
@@ -5,8 +5,7 @@ var React = tslib_1.__importStar(require("react"));
|
|
|
5
5
|
var react_native_1 = require("react-native");
|
|
6
6
|
var immutable_merge_1 = require("@fluentui-react-native/immutable-merge");
|
|
7
7
|
var merge_props_1 = require("@fluentui-react-native/merge-props");
|
|
8
|
-
var
|
|
9
|
-
var enzyme_to_json_1 = tslib_1.__importDefault(require("enzyme-to-json"));
|
|
8
|
+
var renderer = tslib_1.__importStar(require("react-test-renderer"));
|
|
10
9
|
var buildUseTokens_1 = require("./buildUseTokens");
|
|
11
10
|
/**
|
|
12
11
|
* The default/base theme just contains base values
|
|
@@ -26,12 +25,6 @@ var useTheme = function () { return current.theme; };
|
|
|
26
25
|
var setActiveTheme = function (theme) {
|
|
27
26
|
current.theme = (theme && (0, immutable_merge_1.immutableMerge)(baseTheme, theme)) || baseTheme;
|
|
28
27
|
};
|
|
29
|
-
/**
|
|
30
|
-
* this wrapper solves the (so-far) inexplicable type errors from the matchers in typescript
|
|
31
|
-
*/
|
|
32
|
-
function snapshotTestTree(tree) {
|
|
33
|
-
expect((0, enzyme_to_json_1.default)(tree)).toMatchSnapshot();
|
|
34
|
-
}
|
|
35
28
|
/**
|
|
36
29
|
* Helper function used to look up a component in the theme. Having this injected allows this module to not be dependent on the shape of
|
|
37
30
|
* the theme used.
|
|
@@ -88,8 +81,8 @@ describe('useTokens samples', function () {
|
|
|
88
81
|
});
|
|
89
82
|
/** first render the component with no updates */
|
|
90
83
|
it('Sample1Text rendering with no overrides', function () {
|
|
91
|
-
var tree =
|
|
92
|
-
|
|
84
|
+
var tree = renderer.create(React.createElement(SampleText1, null, "Sample1a")).toJSON();
|
|
85
|
+
expect(tree).toMatchSnapshot();
|
|
93
86
|
});
|
|
94
87
|
/** now re-theme the component via the components in the theme */
|
|
95
88
|
it('Sample1Text rendering with some custom settings in the theme', function () {
|
|
@@ -101,8 +94,8 @@ describe('useTokens samples', function () {
|
|
|
101
94
|
},
|
|
102
95
|
},
|
|
103
96
|
});
|
|
104
|
-
var tree =
|
|
105
|
-
|
|
97
|
+
var tree = renderer.create(React.createElement(SampleText1, null, "Sample1b")).toJSON();
|
|
98
|
+
expect(tree).toMatchSnapshot();
|
|
106
99
|
});
|
|
107
100
|
// the Sample2Text component is built the same way as sample1, just using the new hook that has been created
|
|
108
101
|
var SampleText2 = function (props) {
|
|
@@ -122,10 +115,12 @@ describe('useTokens samples', function () {
|
|
|
122
115
|
};
|
|
123
116
|
/** rendering the Sample2 component with the base theme */
|
|
124
117
|
it('Sample2Text rendering with defaults and a color override', function () {
|
|
125
|
-
var tree =
|
|
118
|
+
var tree = renderer
|
|
119
|
+
.create(React.createElement(react_native_1.View, null,
|
|
126
120
|
React.createElement(SampleText2, null, "Sample2 with defaults"),
|
|
127
|
-
React.createElement(SampleText2, { color: "green" }, "Sample2 with color override via prop")))
|
|
128
|
-
|
|
121
|
+
React.createElement(SampleText2, { color: "green" }, "Sample2 with color override via prop")))
|
|
122
|
+
.toJSON();
|
|
123
|
+
expect(tree).toMatchSnapshot();
|
|
129
124
|
});
|
|
130
125
|
/** now re-theme the component via the components in the theme */
|
|
131
126
|
it('Sample2Text rendering with some custom settings in the theme', function () {
|
|
@@ -137,10 +132,12 @@ describe('useTokens samples', function () {
|
|
|
137
132
|
},
|
|
138
133
|
},
|
|
139
134
|
});
|
|
140
|
-
var tree =
|
|
135
|
+
var tree = renderer
|
|
136
|
+
.create(React.createElement(react_native_1.View, null,
|
|
141
137
|
React.createElement(SampleText2, null, "Sample2 with theme overrides set"),
|
|
142
|
-
React.createElement(SampleText2, { color: "purple" }, "Sample2 with theme and color prop override")))
|
|
143
|
-
|
|
138
|
+
React.createElement(SampleText2, { color: "purple" }, "Sample2 with theme and color prop override")))
|
|
139
|
+
.toJSON();
|
|
140
|
+
expect(tree).toMatchSnapshot();
|
|
144
141
|
});
|
|
145
142
|
});
|
|
146
143
|
//# sourceMappingURL=useTokens.samples.test.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useTokens.samples.test.js","sourceRoot":"","sources":["../src/useTokens.samples.test.tsx"],"names":[],"mappings":";;;AAAA,mDAA+B;AAE/B,6CAA0C;AAE1C,0EAAwE;AACxE,kEAAiE;AACjE,
|
|
1
|
+
{"version":3,"file":"useTokens.samples.test.js","sourceRoot":"","sources":["../src/useTokens.samples.test.tsx"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fluentui-react-native/use-tokens",
|
|
3
|
-
"version": "0.6.
|
|
3
|
+
"version": "0.6.2",
|
|
4
4
|
"description": "Utilities and hook function for getting themed tokens for a component",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -28,11 +28,11 @@
|
|
|
28
28
|
"license": "MIT",
|
|
29
29
|
"dependencies": {
|
|
30
30
|
"@fluentui-react-native/immutable-merge": "1.2.2",
|
|
31
|
-
"@fluentui-react-native/memo-cache": "1.3.
|
|
31
|
+
"@fluentui-react-native/memo-cache": "1.3.3",
|
|
32
32
|
"tslib": "^2.3.1"
|
|
33
33
|
},
|
|
34
34
|
"devDependencies": {
|
|
35
|
-
"@fluentui-react-native/merge-props": "0.9.
|
|
35
|
+
"@fluentui-react-native/merge-props": "0.9.1",
|
|
36
36
|
"@fluentui-react-native/scripts": "0.1.1",
|
|
37
37
|
"@react-native/babel-preset": "^0.73.0",
|
|
38
38
|
"@react-native/metro-config": "^0.73.0",
|
|
@@ -1,7 +1,35 @@
|
|
|
1
1
|
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
|
2
2
|
|
|
3
3
|
exports[`useTokens samples Sample1Text rendering with no overrides 1`] = `
|
|
4
|
-
<
|
|
4
|
+
<Text
|
|
5
|
+
style={
|
|
6
|
+
{
|
|
7
|
+
"color": "black",
|
|
8
|
+
"fontFamily": "Arial",
|
|
9
|
+
"fontSize": 12,
|
|
10
|
+
}
|
|
11
|
+
}
|
|
12
|
+
>
|
|
13
|
+
Sample1a
|
|
14
|
+
</Text>
|
|
15
|
+
`;
|
|
16
|
+
|
|
17
|
+
exports[`useTokens samples Sample1Text rendering with some custom settings in the theme 1`] = `
|
|
18
|
+
<Text
|
|
19
|
+
style={
|
|
20
|
+
{
|
|
21
|
+
"color": "pink",
|
|
22
|
+
"fontFamily": "Arial",
|
|
23
|
+
"fontSize": 24,
|
|
24
|
+
}
|
|
25
|
+
}
|
|
26
|
+
>
|
|
27
|
+
Sample1b
|
|
28
|
+
</Text>
|
|
29
|
+
`;
|
|
30
|
+
|
|
31
|
+
exports[`useTokens samples Sample2Text rendering with defaults and a color override 1`] = `
|
|
32
|
+
<View>
|
|
5
33
|
<Text
|
|
6
34
|
style={
|
|
7
35
|
{
|
|
@@ -11,153 +39,45 @@ exports[`useTokens samples Sample1Text rendering with no overrides 1`] = `
|
|
|
11
39
|
}
|
|
12
40
|
}
|
|
13
41
|
>
|
|
14
|
-
|
|
15
|
-
style={
|
|
16
|
-
{
|
|
17
|
-
"color": "black",
|
|
18
|
-
"fontFamily": "Arial",
|
|
19
|
-
"fontSize": 12,
|
|
20
|
-
}
|
|
21
|
-
}
|
|
22
|
-
>
|
|
23
|
-
Sample1a
|
|
24
|
-
</Text>
|
|
42
|
+
Sample2 with defaults
|
|
25
43
|
</Text>
|
|
26
|
-
</SampleText1>
|
|
27
|
-
`;
|
|
28
|
-
|
|
29
|
-
exports[`useTokens samples Sample1Text rendering with some custom settings in the theme 1`] = `
|
|
30
|
-
<SampleText1>
|
|
31
44
|
<Text
|
|
32
45
|
style={
|
|
33
46
|
{
|
|
34
|
-
"color": "
|
|
47
|
+
"color": "green",
|
|
35
48
|
"fontFamily": "Arial",
|
|
36
|
-
"fontSize":
|
|
49
|
+
"fontSize": 12,
|
|
37
50
|
}
|
|
38
51
|
}
|
|
39
52
|
>
|
|
40
|
-
|
|
41
|
-
style={
|
|
42
|
-
{
|
|
43
|
-
"color": "pink",
|
|
44
|
-
"fontFamily": "Arial",
|
|
45
|
-
"fontSize": 24,
|
|
46
|
-
}
|
|
47
|
-
}
|
|
48
|
-
>
|
|
49
|
-
Sample1b
|
|
50
|
-
</Text>
|
|
53
|
+
Sample2 with color override via prop
|
|
51
54
|
</Text>
|
|
52
|
-
</SampleText1>
|
|
53
|
-
`;
|
|
54
|
-
|
|
55
|
-
exports[`useTokens samples Sample2Text rendering with defaults and a color override 1`] = `
|
|
56
|
-
<View>
|
|
57
|
-
<View>
|
|
58
|
-
<SampleText2>
|
|
59
|
-
<Text
|
|
60
|
-
style={
|
|
61
|
-
{
|
|
62
|
-
"color": "black",
|
|
63
|
-
"fontFamily": "Arial",
|
|
64
|
-
"fontSize": 12,
|
|
65
|
-
}
|
|
66
|
-
}
|
|
67
|
-
>
|
|
68
|
-
<Text
|
|
69
|
-
style={
|
|
70
|
-
{
|
|
71
|
-
"color": "black",
|
|
72
|
-
"fontFamily": "Arial",
|
|
73
|
-
"fontSize": 12,
|
|
74
|
-
}
|
|
75
|
-
}
|
|
76
|
-
>
|
|
77
|
-
Sample2 with defaults
|
|
78
|
-
</Text>
|
|
79
|
-
</Text>
|
|
80
|
-
</SampleText2>
|
|
81
|
-
<SampleText2
|
|
82
|
-
color="green"
|
|
83
|
-
>
|
|
84
|
-
<Text
|
|
85
|
-
style={
|
|
86
|
-
{
|
|
87
|
-
"color": "green",
|
|
88
|
-
"fontFamily": "Arial",
|
|
89
|
-
"fontSize": 12,
|
|
90
|
-
}
|
|
91
|
-
}
|
|
92
|
-
>
|
|
93
|
-
<Text
|
|
94
|
-
style={
|
|
95
|
-
{
|
|
96
|
-
"color": "green",
|
|
97
|
-
"fontFamily": "Arial",
|
|
98
|
-
"fontSize": 12,
|
|
99
|
-
}
|
|
100
|
-
}
|
|
101
|
-
>
|
|
102
|
-
Sample2 with color override via prop
|
|
103
|
-
</Text>
|
|
104
|
-
</Text>
|
|
105
|
-
</SampleText2>
|
|
106
|
-
</View>
|
|
107
55
|
</View>
|
|
108
56
|
`;
|
|
109
57
|
|
|
110
58
|
exports[`useTokens samples Sample2Text rendering with some custom settings in the theme 1`] = `
|
|
111
59
|
<View>
|
|
112
|
-
<
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
</Text>
|
|
135
|
-
</SampleText2>
|
|
136
|
-
<SampleText2
|
|
137
|
-
color="purple"
|
|
138
|
-
>
|
|
139
|
-
<Text
|
|
140
|
-
style={
|
|
141
|
-
{
|
|
142
|
-
"color": "purple",
|
|
143
|
-
"fontFamily": "Helvetica",
|
|
144
|
-
"fontSize": 18,
|
|
145
|
-
}
|
|
146
|
-
}
|
|
147
|
-
>
|
|
148
|
-
<Text
|
|
149
|
-
style={
|
|
150
|
-
{
|
|
151
|
-
"color": "purple",
|
|
152
|
-
"fontFamily": "Helvetica",
|
|
153
|
-
"fontSize": 18,
|
|
154
|
-
}
|
|
155
|
-
}
|
|
156
|
-
>
|
|
157
|
-
Sample2 with theme and color prop override
|
|
158
|
-
</Text>
|
|
159
|
-
</Text>
|
|
160
|
-
</SampleText2>
|
|
161
|
-
</View>
|
|
60
|
+
<Text
|
|
61
|
+
style={
|
|
62
|
+
{
|
|
63
|
+
"color": "black",
|
|
64
|
+
"fontFamily": "Helvetica",
|
|
65
|
+
"fontSize": 18,
|
|
66
|
+
}
|
|
67
|
+
}
|
|
68
|
+
>
|
|
69
|
+
Sample2 with theme overrides set
|
|
70
|
+
</Text>
|
|
71
|
+
<Text
|
|
72
|
+
style={
|
|
73
|
+
{
|
|
74
|
+
"color": "purple",
|
|
75
|
+
"fontFamily": "Helvetica",
|
|
76
|
+
"fontSize": 18,
|
|
77
|
+
}
|
|
78
|
+
}
|
|
79
|
+
>
|
|
80
|
+
Sample2 with theme and color prop override
|
|
81
|
+
</Text>
|
|
162
82
|
</View>
|
|
163
83
|
`;
|
|
@@ -4,8 +4,7 @@ import { Text, View } from 'react-native';
|
|
|
4
4
|
|
|
5
5
|
import { immutableMerge } from '@fluentui-react-native/immutable-merge';
|
|
6
6
|
import { mergeStyles } from '@fluentui-react-native/merge-props';
|
|
7
|
-
import
|
|
8
|
-
import toJson from 'enzyme-to-json';
|
|
7
|
+
import * as renderer from 'react-test-renderer';
|
|
9
8
|
|
|
10
9
|
import { buildUseTokens } from './buildUseTokens';
|
|
11
10
|
|
|
@@ -52,13 +51,6 @@ const setActiveTheme = (theme?: Partial<Theme>) => {
|
|
|
52
51
|
current.theme = (theme && immutableMerge<Theme>(baseTheme, theme as Theme)) || baseTheme;
|
|
53
52
|
};
|
|
54
53
|
|
|
55
|
-
/**
|
|
56
|
-
* this wrapper solves the (so-far) inexplicable type errors from the matchers in typescript
|
|
57
|
-
*/
|
|
58
|
-
function snapshotTestTree(tree: any) {
|
|
59
|
-
(expect(toJson(tree)) as any).toMatchSnapshot();
|
|
60
|
-
}
|
|
61
|
-
|
|
62
54
|
/**
|
|
63
55
|
* Helper function used to look up a component in the theme. Having this injected allows this module to not be dependent on the shape of
|
|
64
56
|
* the theme used.
|
|
@@ -139,8 +131,8 @@ describe('useTokens samples', () => {
|
|
|
139
131
|
|
|
140
132
|
/** first render the component with no updates */
|
|
141
133
|
it('Sample1Text rendering with no overrides', () => {
|
|
142
|
-
const tree =
|
|
143
|
-
|
|
134
|
+
const tree = renderer.create(<SampleText1>Sample1a</SampleText1>).toJSON();
|
|
135
|
+
expect(tree).toMatchSnapshot();
|
|
144
136
|
});
|
|
145
137
|
|
|
146
138
|
/** now re-theme the component via the components in the theme */
|
|
@@ -153,8 +145,8 @@ describe('useTokens samples', () => {
|
|
|
153
145
|
},
|
|
154
146
|
},
|
|
155
147
|
});
|
|
156
|
-
const tree =
|
|
157
|
-
|
|
148
|
+
const tree = renderer.create(<SampleText1>Sample1b</SampleText1>).toJSON();
|
|
149
|
+
expect(tree).toMatchSnapshot();
|
|
158
150
|
});
|
|
159
151
|
|
|
160
152
|
/**
|
|
@@ -192,13 +184,15 @@ describe('useTokens samples', () => {
|
|
|
192
184
|
|
|
193
185
|
/** rendering the Sample2 component with the base theme */
|
|
194
186
|
it('Sample2Text rendering with defaults and a color override', () => {
|
|
195
|
-
const tree =
|
|
196
|
-
|
|
197
|
-
<
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
187
|
+
const tree = renderer
|
|
188
|
+
.create(
|
|
189
|
+
<View>
|
|
190
|
+
<SampleText2>Sample2 with defaults</SampleText2>
|
|
191
|
+
<SampleText2 color="green">Sample2 with color override via prop</SampleText2>
|
|
192
|
+
</View>,
|
|
193
|
+
)
|
|
194
|
+
.toJSON();
|
|
195
|
+
expect(tree).toMatchSnapshot();
|
|
202
196
|
});
|
|
203
197
|
|
|
204
198
|
/** now re-theme the component via the components in the theme */
|
|
@@ -211,12 +205,14 @@ describe('useTokens samples', () => {
|
|
|
211
205
|
},
|
|
212
206
|
},
|
|
213
207
|
});
|
|
214
|
-
const tree =
|
|
215
|
-
|
|
216
|
-
<
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
208
|
+
const tree = renderer
|
|
209
|
+
.create(
|
|
210
|
+
<View>
|
|
211
|
+
<SampleText2>Sample2 with theme overrides set</SampleText2>
|
|
212
|
+
<SampleText2 color="purple">Sample2 with theme and color prop override</SampleText2>
|
|
213
|
+
</View>,
|
|
214
|
+
)
|
|
215
|
+
.toJSON();
|
|
216
|
+
expect(tree).toMatchSnapshot();
|
|
221
217
|
});
|
|
222
218
|
});
|