remove setting related to moreButton plugin from default

dev-javascript · dev-javascript · commit 5f2e36407d46 · 2024-06-11T22:45:54.000+03:30
setting and set them at moreButton plugin
diff --git a/src/plugins/moreButtonPlugin/button/button.test.js b/src/plugins/moreButtonPlugin/button/button.test.js
@@ -8,6 +8,12 @@ import components from '../../../components/index.js';
 import CTx from '../../../utils/api/index.js';
 import Api from './api.js';
 import {ApiContext, StateContext} from '../../../context.js';
+import {setSetting} from '../setComponents.js';
+const getIns = (op) => {
+  const ins = new CTx(op);
+  setSetting(ins);
+  return ins;
+};
 let container = document.createElement('div');
 const getButton = (ctx) =>
   memo(
@@ -29,7 +35,7 @@ beforeAll(() => {
 });
 let userProxy = {};
 beforeEach(() => {
-  const ins = new CTx({
+  const ins = getIns({
     options: {},
   });
   userProxy = ins.userProxy;
@@ -45,7 +51,7 @@ afterAll(() => {
 describe('Enable Accesibility : ', () => {
   test('DEFAULT:', () => {
     const Button = getButton(
-      new CTx({
+      getIns({
         options: {
           moreButtonPlugin_iconComponent,
         },
@@ -62,7 +68,7 @@ describe('Enable Accesibility : ', () => {
   });
   test('MULTIPLE BUTTON SHOULD NOT HAVE SAME ID:', () => {
     const Button = getButton(
-      new CTx({
+      getIns({
         options: {
           moreButtonPlugin_iconComponent,
         },
@@ -82,7 +88,7 @@ describe('Enable Accesibility : ', () => {
 describe('DISABLE ACCESIBILITY : ', () => {
   test('DEFAULT:', () => {
     const Button = getButton(
-      new CTx({
+      getIns({
         options: {
           moreButtonPlugin_iconComponent,
           accessibility: false,
@@ -102,7 +108,7 @@ describe('DISABLE ACCESIBILITY : ', () => {
 describe('OPEN AND CLOSE POPPER:', () => {
   test('BUTTON CLICK:', () => {
     const Button = getButton(
-      new CTx({
+      getIns({
         options: {
           moreButtonPlugin_iconComponent,
           //accessibility: false,
@@ -130,7 +136,7 @@ describe('OPEN AND CLOSE POPPER:', () => {
   });
   test('document click:', () => {
     const Button = getButton(
-      new CTx({
+      getIns({
         options: {
           moreButtonPlugin_iconComponent,
         },
@@ -156,7 +162,7 @@ describe('OPEN AND CLOSE POPPER:', () => {
     expect(getBtn().getAttribute('aria-expanded') == 'true').toBe(false);
   });
   test('select tab:', () => {
-    const ins = new CTx({
+    const ins = getIns({
       options: {
         moreButtonPlugin_iconComponent,
       },
@@ -189,7 +195,7 @@ describe('OPEN AND CLOSE POPPER:', () => {
       ref._cleanSelectEvent = jest.fn(() => {});
       return ref;
     };
-    const ins = new CTx({
+    const ins = getIns({
       options: {
         moreButtonPlugin_iconComponent,
       },
@@ -231,7 +237,7 @@ describe('TABS COMPONENT:', () => {
       buttonApi = (Api.default || Api).call(this, components, setOpen);
       return buttonApi;
     };
-    const ins = new CTx({
+    const ins = getIns({
       options: {
         moreButtonPlugin_iconComponent,
         selectedTabID: '1',
@@ -279,7 +285,7 @@ describe('TABS COMPONENT:', () => {
       buttonApi = (Api.default || Api).call(this, components, setOpen);
       return buttonApi;
     };
-    const ins = new CTx({
+    const ins = getIns({
       options: {
         moreButtonPlugin_iconComponent,
         selectedTabID: '1',
@@ -327,7 +333,7 @@ describe('TABS COMPONENT:', () => {
       buttonApi = (Api.default || Api).call(this, components, setOpen);
       return buttonApi;
     };
-    const ins = new CTx({
+    const ins = getIns({
       options: {
         moreButtonPlugin_iconComponent,
         selectedTabID: '1',
diff --git a/src/plugins/moreButtonPlugin/setComponents.js b/src/plugins/moreButtonPlugin/setComponents.js
@@ -2,6 +2,7 @@ import React, {memo} from 'react';
 import PropTypes from 'prop-types';
 export default function setComponents(deps, ctx, components) {
   const {moreButtonPlugin_buttonComponent, ShowMoreTabs, moreButtonPlugin_iconComponent} = deps;
+  setComponents.setSetting(ctx);
   setComponents.setDefaultOptions(ctx, components, moreButtonPlugin_buttonComponent, moreButtonPlugin_iconComponent);
   setComponents.setTablistView(components);
   setComponents.setMoreButtonPlugin(ctx, components, ShowMoreTabs, setComponents.ShowMoreButton, memo);
@@ -71,3 +72,8 @@ export const setDefaultOptions = (setComponents.setDefaultOptions = function (
     ctx.optionsManager.options,
   );
 });
+export const setSetting = (setComponents.setSetting = function (ctx) {
+  ctx.optionsManager.setting.showMoreContainerClass = 'rc-dyn-tabs-showmorebutton-container';
+  ctx.optionsManager.setting.showMoreButtonClass = 'rc-dyn-tabs-showmorebutton';
+  ctx.optionsManager.setting.showMorePopperClass = 'rc-dyn-tabs-popper';
+});
diff --git a/src/plugins/moreButtonPlugin/setComponents.test.js b/src/plugins/moreButtonPlugin/setComponents.test.js
@@ -7,6 +7,7 @@ import showMorePlugin, {
   setTablistOverflow,
   setTablistView,
   setDefaultOptions,
+  setSetting,
 } from './setComponents.js';
 beforeAll(() => {});
 beforeEach(() => {});
@@ -82,12 +83,24 @@ describe('showMorePlugin ', () => {
     expect(moreButtonPlugin_buttonComponent.mock.calls.length).toBe(1);
     expect(moreButtonPlugin_buttonComponent.mock.calls[0][0]).toEqual({ctx, components});
   });
+  test('setSetting : ', () => {
+    const ctx = {
+      optionsManager: {
+        setting: {},
+      },
+    };
+    setSetting(ctx);
+    expect(ctx.optionsManager.setting.showMoreContainerClass).toBe('rc-dyn-tabs-showmorebutton-container');
+    expect(ctx.optionsManager.setting.showMoreButtonClass).toBe('rc-dyn-tabs-showmorebutton');
+    expect(ctx.optionsManager.setting.showMorePopperClass).toBe('rc-dyn-tabs-popper');
+  });
   test('constructor : ', () => {
     showMorePlugin.ShowMoreButton = jest.fn(() => {});
     showMorePlugin.setMoreButtonPlugin = jest.fn(() => {});
     showMorePlugin.setTablistOverflow = jest.fn(() => {});
     showMorePlugin.setTablistView = jest.fn(() => {});
     showMorePlugin.setDefaultOptions = jest.fn(() => {});
+    showMorePlugin.setSetting = jest.fn(() => {});
     const deps = {
       moreButtonPlugin_buttonComponent: 'moreButtonPlugin_buttonComponent',
       ShowMoreTabs: 'ShowMoreTabs',
@@ -96,10 +109,12 @@ describe('showMorePlugin ', () => {
     const ctx = {};
     const components = {};
     showMorePlugin(deps, ctx, components);
+    expect(showMorePlugin.setSetting.mock.calls.length).toBe(1);
     expect(showMorePlugin.setDefaultOptions.mock.calls.length).toBe(1);
     expect(showMorePlugin.setTablistView.mock.calls.length).toBe(1);
     expect(showMorePlugin.setMoreButtonPlugin.mock.calls.length).toBe(1);
     expect(showMorePlugin.setTablistOverflow.mock.calls.length).toBe(1);
+    expect(showMorePlugin.setSetting).toHaveBeenCalledBefore(showMorePlugin.setDefaultOptions);
     expect(showMorePlugin.setDefaultOptions).toHaveBeenCalledBefore(showMorePlugin.setTablistView);
     expect(showMorePlugin.setTablistView).toHaveBeenCalledBefore(showMorePlugin.setMoreButtonPlugin);
     expect(showMorePlugin.setMoreButtonPlugin).toHaveBeenCalledBefore(showMorePlugin.setTablistOverflow);
diff --git a/src/plugins/moreButtonPlugin/show-more-tabs/show-more-tabs.test.js b/src/plugins/moreButtonPlugin/show-more-tabs/show-more-tabs.test.js
@@ -7,6 +7,7 @@ import renderer from 'react-test-renderer';
 import Api from './api.js';
 import tabsMoreButton from 'tabs-more-button';
 import Ctx from '../../../utils/api/index.js';
+import {setSetting} from '../setComponents.js';
 let container = document.createElement('div');
 const moreButtonPlugin_buttonComponent = (props) => <div {...props}>{props.children}</div>;
 const ctx = new Ctx({
@@ -19,6 +20,7 @@ const ctx = new Ctx({
     ],
   },
 });
+setSetting(ctx);
 /**
  * render the app
  * @param {boolean} snapshot - if true then returns the element
diff --git a/src/utils/api/optionManager/optionManager.factory.js b/src/utils/api/optionManager/optionManager.factory.js
@@ -92,9 +92,6 @@ export default Helper.module(
         tablistContainerClass: 'rc-dyn-tabs-tablist-container',
         tablistOverflowClass: 'rc-dyn-tabs-tablist-overflow',
         tablistClass: 'rc-dyn-tabs-tablist',
-        showMoreContainerClass: 'rc-dyn-tabs-showmorebutton-container',
-        showMoreButtonClass: 'rc-dyn-tabs-showmorebutton',
-        showMorePopperClass: 'rc-dyn-tabs-popper',
         panelIdTemplate: (id) => `rc-dyn-tabs-p-${id}`,
         ariaLabelledbyIdTemplate: (id) => `rc-dyn-tabs-l-${id}`,
         getDefaultTabData: () => {
diff --git a/src/utils/api/optionManager/optionManager.test.js b/src/utils/api/optionManager/optionManager.test.js
@@ -61,9 +61,6 @@ describe('OptionManager constructor : ', () => {
       tablistContainerClass: 'rc-dyn-tabs-tablist-container',
       tablistOverflowClass: 'rc-dyn-tabs-tablist-overflow',
       tablistClass: 'rc-dyn-tabs-tablist',
-      showMoreContainerClass: 'rc-dyn-tabs-showmorebutton-container',
-      showMoreButtonClass: 'rc-dyn-tabs-showmorebutton',
-      showMorePopperClass: 'rc-dyn-tabs-popper',
       panelIdTemplate: function () {},
       ariaLabelledbyIdTemplate: function () {},
       getDefaultTabData: function () {},
