Guest User

Untitled

a guest
Jun 22nd, 2018
60
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 11.82 KB | None | 0 0
  1. // This is a Jest spec that explores some of the different ways to alter
  2. // arrays and objects without mutating state. I'm trying different approaches
  3. // available using:
  4. //
  5. // * Vanilla JS
  6. // * Immutable.js
  7. // * Lodash
  8. // * Rambda
  9. //
  10. // The motivation for this is largely to work with a Redux store.
  11.  
  12. import R from "rambda";
  13. import _ from "lodash";
  14. import { Map, List } from "immutable";
  15. import * as I from "../helpers/imu";
  16.  
  17. describe("immutable Array operations", () => {
  18. let characters;
  19.  
  20. beforeEach(() => {
  21. characters = ["Walter", "Jeffrey", "Donald"];
  22. });
  23.  
  24. describe("add item to an array", () => {
  25. let expectedResult, newCharacter;
  26.  
  27. beforeEach(() => {
  28. newCharacter = "Maude";
  29. expectedResult = ["Walter", "Jeffrey", "Donald", "Maude"];
  30. });
  31.  
  32. describe("with vanilla JS spread operator", () => {
  33. it("returns the expected result", () => {
  34. const result = [...characters, newCharacter];
  35. expect(result).toEqual(expectedResult);
  36. });
  37. });
  38.  
  39. describe("with vanilla JS concat", () => {
  40. it("returns the expected result", () => {
  41. const result = characters.concat(newCharacter);
  42. expect(result).toEqual(expectedResult);
  43. });
  44. });
  45.  
  46. describe("with lodash concat", () => {
  47. it("returns the expected result", () => {
  48. const result = _.concat(characters, newCharacter);
  49. expect(result).toEqual(expectedResult);
  50. });
  51. });
  52.  
  53. describe("with Ramda append", () => {
  54. it("returns the expected result", () => {
  55. const result = R.append(newCharacter, characters);
  56. expect(result).toEqual(expectedResult);
  57. });
  58. });
  59.  
  60. describe("with Immutable.js push", () => {
  61. it("returns the expected result", () => {
  62. const immutableCharacters = List(characters);
  63. const result = immutableCharacters.push(newCharacter);
  64. expect(result.toArray()).toEqual(expectedResult);
  65. });
  66. });
  67.  
  68. describe("with Immutable.js set", () => {
  69. it("returns the expected result", () => {
  70. const immutableCharacters = List(characters);
  71. const result = immutableCharacters.set(
  72. immutableCharacters.size,
  73. newCharacter,
  74. );
  75. expect(result.toArray()).toEqual(expectedResult);
  76. });
  77. });
  78.  
  79. describe("with imu add", () => {
  80. it("returns the expected result", () => {
  81. const result = I.add(characters, newCharacter);
  82. expect(result).toEqual(expectedResult);
  83. });
  84. });
  85. });
  86.  
  87. describe("update an item in an array", () => {
  88. let expectedResult, characterToUpdate, updatedName;
  89.  
  90. beforeEach(() => {
  91. characterToUpdate = "Jeffrey";
  92. updatedName = "The Dude";
  93. expectedResult = ["Walter", "The Dude", "Donald"];
  94. });
  95.  
  96. describe("with vanilla JS map", () => {
  97. it("returns the expected result", () => {
  98. const result = characters.map(c => {
  99. if (c === characterToUpdate) {
  100. return updatedName;
  101. }
  102. return c;
  103. });
  104. expect(result).toEqual(expectedResult);
  105. });
  106. });
  107.  
  108. describe("with vanilla JS findIndex, spread operator, and slice", () => {
  109. it("returns the expected result", () => {
  110. const updateIndex = characters.findIndex(c => c === characterToUpdate);
  111. const result = [
  112. ...characters.slice(0, updateIndex),
  113. updatedName,
  114. ...characters.slice(updateIndex + 1),
  115. ];
  116. expect(result).toEqual(expectedResult);
  117. });
  118. });
  119.  
  120. describe("with Ramda findIndex and update", () => {
  121. it("returns the expected result", () => {
  122. const updateIndex = R.findIndex(R.equals(characterToUpdate))(
  123. characters,
  124. );
  125. const result = R.update(updateIndex, updatedName, characters);
  126. expect(result).toEqual(expectedResult);
  127. });
  128. });
  129.  
  130. describe("with Immutable.js findIndex and splice", () => {
  131. it("returns the expected result", () => {
  132. const immutableCharacters = List(characters);
  133. const updateIndex = immutableCharacters.findIndex(
  134. c => c === characterToUpdate,
  135. );
  136. const result = immutableCharacters.splice(updateIndex, 1, updatedName);
  137. expect(result.toArray()).toEqual(expectedResult);
  138. });
  139. });
  140.  
  141. describe("with Immutable.js findIndex and set", () => {
  142. it("returns the expected result", () => {
  143. const immutableCharacters = List(characters);
  144. const updateIndex = immutableCharacters.findIndex(
  145. c => c === characterToUpdate,
  146. );
  147. const result = immutableCharacters.set(updateIndex, updatedName);
  148. expect(result.toArray()).toEqual(expectedResult);
  149. });
  150. });
  151.  
  152. describe("with imu set", () => {
  153. it("returns the expected result", () => {
  154. const result = I.set(characters, characterToUpdate, updatedName);
  155. expect(result).toEqual(expectedResult);
  156. });
  157. });
  158. });
  159.  
  160. describe("remove an item from an array", () => {
  161. let expectedResult, characterToRemove;
  162.  
  163. beforeEach(() => {
  164. characterToRemove = "Donald";
  165. expectedResult = ["Walter", "Jeffrey"];
  166. });
  167.  
  168. describe("with vanillla JS filter", () => {
  169. it("returns the expected result", () => {
  170. const result = characters.filter(c => c !== characterToRemove);
  171. expect(result).toEqual(expectedResult);
  172. });
  173. });
  174.  
  175. describe("with vanillla JS findIndex and slice", () => {
  176. it("returns the expected result", () => {
  177. const removeIndex = characters.findIndex(c => c === characterToRemove);
  178. const result = [
  179. ...characters.slice(0, removeIndex),
  180. ...characters.slice(removeIndex + 1),
  181. ];
  182. expect(result).toEqual(expectedResult);
  183. });
  184. });
  185.  
  186. describe("with Rambda reject", () => {
  187. it("returns the expected result", () => {
  188. const result = R.reject(R.equals(characterToRemove), characters);
  189. expect(result).toEqual(expectedResult);
  190. });
  191. });
  192.  
  193. describe("with Immutable.js remove", () => {
  194. it("returns the expected result", () => {
  195. const immutableCharacters = List(characters);
  196. const removeIndex = immutableCharacters.findIndex(
  197. c => c === characterToRemove,
  198. );
  199. const result = immutableCharacters.remove(removeIndex);
  200. expect(result.toArray()).toEqual(expectedResult);
  201. });
  202. });
  203.  
  204. describe("with imu del", () => {
  205. it("returns the expected result", () => {
  206. const result = I.del(characters, characterToRemove);
  207. expect(result).toEqual(expectedResult);
  208. });
  209. });
  210. });
  211. });
  212.  
  213. describe("immutable Object operations", () => {
  214. let characters;
  215.  
  216. beforeEach(() => {
  217. characters = {
  218. 1: { firstName: "Jeffrey", lastName: "Lebowski" },
  219. 2: { firstName: "Walter", lastName: "Sobchak" },
  220. 3: { firstName: "Donald", lastName: "Kerabatsos" },
  221. };
  222. });
  223.  
  224. describe("add a key to an object", () => {
  225. let expectedResult;
  226.  
  227. beforeEach(() => {
  228. expectedResult = {
  229. 1: { firstName: "Jeffrey", lastName: "Lebowski" },
  230. 2: { firstName: "Walter", lastName: "Sobchak" },
  231. 3: { firstName: "Donald", lastName: "Kerabatsos" },
  232. 4: { firstName: "Maude", lastName: "Lebowski" },
  233. };
  234. });
  235.  
  236. describe("with vanilla JS spread operator", () => {
  237. it("returns the expected results", () => {
  238. const newId = 4;
  239. const newCharacter = { firstName: "Maude", lastName: "Lebowski" };
  240. const result = { ...characters, [newId]: newCharacter };
  241. expect(result).toEqual(expectedResult);
  242. });
  243. });
  244.  
  245. describe("with Immutable.js set", () => {
  246. it("returns the expected results", () => {
  247. const newId = 4;
  248. const newCharacter = { firstName: "Maude", lastName: "Lebowski" };
  249. const immutableCharacters = Map(characters);
  250. const result = immutableCharacters.set(newId, newCharacter);
  251. expect(result.toObject()).toEqual(expectedResult);
  252. });
  253. });
  254.  
  255. describe("with imu add", () => {
  256. it("returns the expected results", () => {
  257. const newId = 4;
  258. const newCharacter = { firstName: "Maude", lastName: "Lebowski" };
  259. const result = I.add(characters, newId, newCharacter);
  260. expect(result).toEqual(expectedResult);
  261. });
  262. });
  263. });
  264.  
  265. describe("update an object key's value", () => {
  266. let expectedResult;
  267.  
  268. beforeEach(() => {
  269. expectedResult = {
  270. 1: { firstName: "The Dude", lastName: "Lebowski" },
  271. 2: { firstName: "Walter", lastName: "Sobchak" },
  272. 3: { firstName: "Donald", lastName: "Kerabatsos" },
  273. };
  274. });
  275.  
  276. describe("with vanilla JS spread operator", () => {
  277. it("returns the expected results", () => {
  278. const updateId = 1;
  279. const updatedcharacter = {
  280. firstName: "The Dude",
  281. lastName: "Lebowski",
  282. };
  283. const result = { ...characters, [updateId]: updatedcharacter };
  284. expect(result).toEqual(expectedResult);
  285. });
  286. });
  287.  
  288. describe("with Immutable.js set", () => {
  289. it("returns the expected results", () => {
  290. const immutableCharacters = Map(characters);
  291. const updateId = 1;
  292. const updatedcharacter = {
  293. firstName: "The Dude",
  294. lastName: "Lebowski",
  295. };
  296. const result = immutableCharacters.set(`${updateId}`, updatedcharacter);
  297. expect(result.toObject()).toEqual(expectedResult);
  298. });
  299. });
  300.  
  301. describe("with imu set", () => {
  302. it("returns the expected results", () => {
  303. const updateId = 1;
  304. const updatedCharacter = {
  305. firstName: "The Dude",
  306. lastName: "Lebowski",
  307. };
  308. const result = I.set(characters, updateId, updatedCharacter);
  309. expect(result).toEqual(expectedResult);
  310. });
  311. });
  312. });
  313.  
  314. describe("delete an object's key", () => {
  315. let expectedResult, deleteId;
  316.  
  317. beforeEach(() => {
  318. deleteId = 3;
  319. expectedResult = {
  320. 1: { firstName: "Jeffrey", lastName: "Lebowski" },
  321. 2: { firstName: "Walter", lastName: "Sobchak" },
  322. };
  323. });
  324.  
  325. describe("with vanilla JS spread operator", () => {
  326. it("returns the expected results", () => {
  327. // if the key is a string we can skip type casting to string
  328. // const { [deleteId]: deleted, ...result } = characters;
  329. const { [`${deleteId}`]: deleted, ...result } = characters;
  330. expect(result).toEqual(expectedResult);
  331. });
  332. });
  333.  
  334. describe("with vanilla JS reduce", () => {
  335. it("returns the expected results", () => {
  336. const result = Object.keys(characters).reduce((newObj, id) => {
  337. if (id !== `${deleteId}`) {
  338. return { ...newObj, [id]: characters[id] };
  339. }
  340. return newObj;
  341. }, {});
  342. expect(result).toEqual(expectedResult);
  343. });
  344. });
  345.  
  346. describe("with lodash omit", () => {
  347. it("returns the expected results", () => {
  348. // note that we can pass in an integer key here and it handles it without needing to type cast
  349. const result = _.omit(characters, deleteId);
  350. expect(result).toEqual(expectedResult);
  351. });
  352. });
  353.  
  354. describe("with Ramda omit", () => {
  355. it("returns the expected results", () => {
  356. // can't pass in an integer key here so we need to type cast it to a string
  357. const result = R.omit(`${deleteId}`, characters);
  358. expect(result).toEqual(expectedResult);
  359. });
  360. });
  361.  
  362. describe("with Immutable.js", () => {
  363. it("returns the expected results", () => {
  364. const immutableCharacters = Map(characters);
  365. // can't pass in an integer key here so we need to type cast it to a string
  366. const result = immutableCharacters.delete(`${deleteId}`);
  367. expect(result.toObject()).toEqual(expectedResult);
  368. });
  369. });
  370.  
  371. describe("with imu del", () => {
  372. it("returns the expected results", () => {
  373. const result = I.del(characters, deleteId);
  374. expect(result).toEqual(expectedResult);
  375. });
  376. });
  377. });
  378. });
Add Comment
Please, Sign In to add comment