DSLinkMenu.test.jsx (5305B)
1 import { mount } from "enzyme"; 2 import { DSLinkMenu } from "content-src/components/DiscoveryStreamComponents/DSLinkMenu/DSLinkMenu"; 3 import { ContextMenuButton } from "content-src/components/ContextMenu/ContextMenuButton"; 4 import { LinkMenu } from "content-src/components/LinkMenu/LinkMenu"; 5 import React from "react"; 6 import { Provider } from "react-redux"; 7 import { combineReducers, createStore } from "redux"; 8 import { INITIAL_STATE, reducers } from "common/Reducers.sys.mjs"; 9 10 describe("<DSLinkMenu>", () => { 11 let wrapper; 12 let store; 13 14 describe("DS link menu actions", () => { 15 beforeEach(() => { 16 store = createStore(combineReducers(reducers), INITIAL_STATE); 17 wrapper = mount( 18 <Provider store={store}> 19 <DSLinkMenu /> 20 </Provider> 21 ); 22 }); 23 24 afterEach(() => { 25 wrapper.unmount(); 26 }); 27 28 it("should parse args for fluent correctly ", () => { 29 const title = '"fluent"'; 30 wrapper = mount( 31 <Provider store={store}> 32 <DSLinkMenu title={title} /> 33 </Provider> 34 ); 35 36 const button = wrapper.find( 37 "button[data-l10n-id='newtab-menu-content-tooltip']" 38 ); 39 assert.equal(button.prop("data-l10n-args"), JSON.stringify({ title })); 40 }); 41 }); 42 43 describe("DS context menu options", () => { 44 const ValidDSLinkMenuProps = { 45 site: {}, 46 card_type: "organic", 47 }; 48 49 beforeEach(() => { 50 wrapper = mount( 51 <Provider store={store}> 52 <DSLinkMenu {...ValidDSLinkMenuProps} /> 53 </Provider> 54 ); 55 }); 56 57 afterEach(() => { 58 wrapper.unmount(); 59 }); 60 61 it("should render a context menu button", () => { 62 assert.ok(wrapper.exists()); 63 assert.ok( 64 wrapper.find(ContextMenuButton).exists(), 65 "context menu button exists" 66 ); 67 }); 68 69 it("should render LinkMenu when context menu button is clicked", () => { 70 let button = wrapper.find(ContextMenuButton); 71 button.simulate("click", { preventDefault: () => {} }); 72 assert.equal(wrapper.find(LinkMenu).length, 1); 73 }); 74 75 it("should pass dispatch, onShow, site, options, shouldSendImpressionStats, source and index to LinkMenu", () => { 76 wrapper 77 .find(ContextMenuButton) 78 .simulate("click", { preventDefault: () => {} }); 79 const linkMenuProps = wrapper.find(LinkMenu).props(); 80 [ 81 "dispatch", 82 "onShow", 83 "site", 84 "index", 85 "options", 86 "source", 87 "shouldSendImpressionStats", 88 ].forEach(prop => assert.property(linkMenuProps, prop)); 89 }); 90 91 it("should pass through the correct menu options to LinkMenu for recommended stories", () => { 92 wrapper 93 .find(ContextMenuButton) 94 .simulate("click", { preventDefault: () => {} }); 95 const linkMenuProps = wrapper.find(LinkMenu).props(); 96 assert.deepEqual(linkMenuProps.options, [ 97 "CheckBookmark", 98 "Separator", 99 "OpenInNewWindow", 100 "OpenInPrivateWindow", 101 "Separator", 102 "BlockUrl", 103 ]); 104 }); 105 106 it("should pass through ReportContent as a link menu option when section is defined", () => { 107 wrapper = mount( 108 <Provider store={store}> 109 <DSLinkMenu {...ValidDSLinkMenuProps} section="abc" /> 110 </Provider> 111 ); 112 113 wrapper 114 .find(ContextMenuButton) 115 .simulate("click", { preventDefault: () => {} }); 116 const linkMenuProps = wrapper.find(LinkMenu).props(); 117 assert.deepEqual(linkMenuProps.options, [ 118 "CheckBookmark", 119 "Separator", 120 "OpenInNewWindow", 121 "OpenInPrivateWindow", 122 "Separator", 123 "BlockUrl", 124 "ReportContent", 125 ]); 126 }); 127 128 it("should pass through the correct menu options to LinkMenu for SPOCs", () => { 129 wrapper = mount( 130 <Provider store={store}> 131 <DSLinkMenu {...ValidDSLinkMenuProps} card_type="spoc" /> 132 </Provider> 133 ); 134 wrapper 135 .find(ContextMenuButton) 136 .simulate("click", { preventDefault: () => {} }); 137 const linkMenuProps = wrapper.find(LinkMenu).props(); 138 assert.deepEqual(linkMenuProps.options, [ 139 "BlockUrl", 140 "ManageSponsoredContent", 141 "OurSponsorsAndYourPrivacy", 142 ]); 143 }); 144 145 it("should pass through the correct menu options to LinkMenu for SPOCs when ReportAds enabled", () => { 146 const stateWithReporting = { 147 ...INITIAL_STATE, 148 Prefs: { 149 ...INITIAL_STATE.Prefs, 150 values: { 151 ...INITIAL_STATE.Prefs.values, 152 "discoverystream.reportAds.enabled": true, 153 }, 154 }, 155 }; 156 157 store = createStore(combineReducers(reducers), stateWithReporting); 158 159 wrapper = mount( 160 <Provider store={store}> 161 <DSLinkMenu 162 {...ValidDSLinkMenuProps} 163 card_type="spoc" 164 shim={{ report: {} }} 165 /> 166 </Provider> 167 ); 168 wrapper 169 .find(ContextMenuButton) 170 .simulate("click", { preventDefault: () => {} }); 171 const linkMenuProps = wrapper.find(LinkMenu).props(); 172 assert.deepEqual(linkMenuProps.options, [ 173 "BlockUrl", 174 "ReportAd", 175 "ManageSponsoredContent", 176 "OurSponsorsAndYourPrivacy", 177 ]); 178 }); 179 }); 180 });