I am trying to inject middle ware and load pl upload through that. Below are the packages I am trying to integrate inside my application.
https://www.npmjs.com/package/plupload
https://www.npmjs.com/package/redux-plupload
I am getting below error. I tried reinstall packages and run however no luck.
Need suggestion if I am missing anything.
ReferenceError: Image is not defined
at .....\node_modules\plupload\js\plupload.full.min.js:13:12305
at .....\node_modules\plupload\js\plupload.full.min.js:13:12504
at .....\node_modules\plupload\js\plupload.full.min.js:13:13299
at .....\node_modules\plupload\js\plupload.full.min.js:13:709
at i (.....\node_modules\plupload\js\plupload.full.min.js:13:402)
at n (.....\node_modules\plupload\js\plupload.full.min.js:13:687)
at .....\node_modules\plupload\js\plupload.full.min.js:13:5378
at Object.<anonymous> (.....\node_modules\plupload\js\plupload.full.min.js:16:11339)
at i (.....\node_modules\plupload\js\plupload.full.min.js:13:51)
at i (.....\node_modules\plupload\js\plupload.full.min.js:13:193)
at Object.<anonymous> (.....\node_modules\plupload\js\plupload.full.min.js:13:209)
at Module._compile (internal/modules/cjs/loader.js:701:30)
at Module._compile (.....\node_modules\pirates\lib\index.js:99:24)
at Module._extensions..js (internal/modules/cjs/loader.js:712:10)
at Object.newLoader [as .js] (.....\node_modules\pirates\lib\index.js:104:7)
at Module.load (internal/modules/cjs/loader.js:600:32)
UPDATE -
Just to give more code insight, Below is the code
import {createMiddleware as createUploaderMiddleware} from 'redux-plupload';
import plupload from 'plupload';
const uploadDocmentMiddleware = (config) => (store) => (next) => (action) => {
// For now just returning some value
return true;
};
export default function configureStore(initialState) {
const uploaderMiddleware = createUploaderMiddleware(plupload, {
uploadDocmentMiddleware
});
return createStore(
rootReducer,
initialState,
// Initiate redux dev tools
composeWithDevTools(
applyMiddleware(
FirstMiddleware(config),
SecondMiddleware(config),
...
.....
// middle ware for pl upload
uploaderMiddleware(config),
typeof window !== 'undefined' && reduxImmutableStateInvariant()
)
)
);
}
Thank you!
We figured out, seems due to server rendering it breaks to load Pl upload and moxie.
We do not have any workaround yet for same. :(
Thanks though.
Related
I'm trying to add slash commands to my discord bot using Discord.js and Rest but I keep getting an unexpected token somewhere in rest. Could anybody help me?
When I run:
const { SlashCommandBuilder, Routes } = require('discord.js');
const { REST } = require('#discordjs/rest');
var clientId = //myClientId
var guildId = //myGuildId
const commands = [
new SlashCommandBuilder().setName('ping').setDescription('Replies with pong!')
]
commands.map(command => command.toJSON());
const rest = new REST({ version: '10' }).setToken(process.env.TOKEN);
(async () => {
try {
console.log('Started refreshing application (/) commands.');
await rest.put(
Routes.applicationCommands(clientId),
{ body: commands },
);
console.log('Successfully reloaded application (/) commands.');
} catch (error) {
console.error(error);
}
})();
I Get:
/home/runner/TinkerTank/node_modules/#discordjs/rest/dist/lib/CDN.cjs:53
extension: extension ?? "png"
^
SyntaxError: Unexpected token '?'
at wrapSafe (internal/modules/cjs/loader.js:915:16)
at Module._compile (internal/modules/cjs/loader.js:963:27)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:1027:10)
at Module.load (internal/modules/cjs/loader.js:863:32)
at Function.Module._load (internal/modules/cjs/loader.js:708:14)
at Module.require (internal/modules/cjs/loader.js:887:19)
at require (internal/modules/cjs/helpers.js:74:18)
at Object.<anonymous> (/home/runner/TinkerTank/node_modules/#discordjs/rest/dist/index.cjs:5:13)
at Module._compile (internal/modules/cjs/loader.js:999:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:1027:10)
If somebody could help me out that would be great.
maby this will help you. npm install node#16.13.1 --save-dev --save-exact
For me, this solved the problem.
I found this here
I am getting the following error on cypress when testing my application:
CypressError: Timed out retrying: cy.its() errored because the property: 'store' does not exist on your subject.
Here is the test line which is broken:
cy.window().its('store').invoke('getState').then((state) => {
expect(state.token).to.equal(tokenResponseMock.token);
});
In my code everything is working fine, i got all data on the store, no issues, but do not pass on the test due to the 'store' not found. I wonder why I am getting store error if it's working as expected. I have no clue what is going on. Does anybody can give me a light on how to solve this error?
Login.js - the function which dispatch to the store
async function handleClick() {
const { dispatchToken } = props;
const tokenInfo = await fetchToken();
localStorage.setItem('token', JSON.stringify(tokenInfo.token));
dispatchToken(tokenInfo.token);
history.push('/game');
}
Just found out what was going on.
When using cypress for testing, you need to add the following code to the store file in order to work:
if (window.Cypress) {
window.store = store;
}
Don't mix up localStorage and React store, they are two different things.
localStorage
cy.get(somthing).click()
.should(() => {
const token = localStorage.getItem('token')
expect(token).to.equal(tokenResponseMock.token)
})
React store
In React app, add store to Cypress object
// init store
if (window.Cypress) {
window.Cypress.store = store // add to Cypress not window in case of conflict
}
In test
cy.get(somthing).click()
.should(() => {
Cypress.store.getState().then(state => {
expect(state.token).to.equal(tokenResponseMock.token)
})
})
I'm making a bot for ddiscord and I can't solve this error:
TypeError [CLIENT_MISSING_INTENTS]: Valid intents must be provided for the Client.
const { Client, Intents } = require('discord.js');
const client = new Client({ intents: [Intents.FLAGS.GUILDS, Intents.FLAGS.GUILD_MESSAGES] });
const config = require('./config.json')
const dotenv = require('dotenv')
dotenv.config()
const privateMessage = require('./private-message');
const test = require('./test.js')
const mySecret = process.env['TOKEN'];
client.on('ready', () => {
console.log(`${client.user.tag} has logged in.`);
});
and this is the complete error:
D:\user\Bots\dadobot2801\a\node_modules\discord.js\src\client\Client.js:548
throw new TypeError('CLIENT_MISSING_INTENTS');
^
TypeError [CLIENT_MISSING_INTENTS]: Valid intents must be provided for the Client.
at Client._validateOptions (D:\user\Bots\dadobot2801\a\node_modules\discord.js\src\client\Client.js:548:13)
at new Client (D:\user\Bots\dadobot2801\a\node_modules\discord.js\src\client\Client.js:76:10)
at Object.<anonymous> (D:\user\Bots\dadobot2801\a\test.js:4:16)
at Module._compile (node:internal/modules/cjs/loader:1101:14)
at Object.Module._extensions..js (node:internal/modules/cjs/loader:1153:10)
at Module.load (node:internal/modules/cjs/loader:981:32)
at Function.Module._load (node:internal/modules/cjs/loader:822:12)
at Module.require (node:internal/modules/cjs/loader:1005:19)
at require (node:internal/modules/cjs/helpers:102:18)
at Object.<anonymous> (D:\user\Bots\dadobot2801\a\index.js:10:14) {
[Symbol(code)]: 'CLIENT_MISSING_INTENTS'
}
Any ideas?
Try using this. Since new updated of discord.js like version ^13.0 you have to specify client intents:
const { Client, Intents } = require('discord.js');
const client = new Client({ intents: [Intents.FLAGS.GUILDS, Intents.FLAGS.GUILD_MESSAGES] });
Its how you do it
I had this problem before so i know how to fix it. You need to enable these 3 intents as seen in the image above.
Try this:
npm uni discord.js
npm i discord.js#12.5.3
Problem
When I try to run my tests via npm test using Jest, with React, and Testing Library I get the following error:
Error
/node_modules/react-dom/cjs/react-dom.development.js:3905
var evt = document.createEvent('Event');
^
TypeError: Cannot read property 'createEvent' of null
at Object.invokeGuardedCallbackDev (/node_modules/react-dom/cjs/react-dom.development.js:3905:26)
at invokeGuardedCallback (/node_modules/react-dom/cjs/react-dom.development.js:4056:31)
at flushPassiveEffectsImpl (/node_modules/react-dom/cjs/react-dom.development.js:23543:11)
at unstable_runWithPriority (/node_modules/scheduler/cjs/scheduler.development.js:468:12)
at runWithPriority$1 (/node_modules/react-dom/cjs/react-dom.development.js:11276:10)
at flushPassiveEffects (/node_modules/react-dom/cjs/react-dom.development.js:23447:14)
at Object.<anonymous>.flushWork (/node_modules/react-dom/cjs/react-dom-test-utils.development.js:992:10)
at Immediate.<anonymous> (/node_modules/react-dom/cjs/react-dom-test-utils.development.js:1003:11)
at processImmediate (node:internal/timers:464:21)
/node_modules/react-dom/cjs/react-dom.development.js:3905
var evt = document.createEvent('Event');
It was Testing Library all along
After nearly losing my sanity, I found out the resolve to this is quite simple. I accidentally allowed my IDE to autocomplete to findByAltText rather than what I normally use: getByAltText. The findBy requires the test to be async and the call to have await.
Broken
it('displays the logo', () => {
const logo = screen.findByAltText('Logo')
expect(logo).toBeInTheDocument()
})
Fixed
Needs: async and await when using findBy
it('displays the logo', async () => {
const logo = await screen.findByAltText('Logo')
expect(logo).toBeInTheDocument()
})
Another Option
Just use the getBy like I am used to!
it('displays the logo', () => {
const logo = screen.getByAltText('Logo')
expect(logo).toBeInTheDocument()
})
Bonus
Through my research I found: eslint-plugin-testing-library, it can at least warn you about this problem through your linter. Make sure to follow its setup.
https://github.com/testing-library/eslint-plugin-testing-library
I'm using redux with redux devtool
I just tried redux-form: great job and funny to use! However, I guess that each time I modify a fied, the app state changed. redux devtool saves each new key tapped in a field. it slows field refreshes a lot!
Here is the the redux devtool dock panel that shows me app state changes:
Here is how I link redux-devtool to my app store:
const createStoreWithMiddleware = (() => {
//DEv too only available in development
if (__DEV__ && window && window.location) {
return compose(
applyMiddleware(thunk),
devTools.instrument(),
persistState(
window.location.href.match(/[?&]debug_session=([^&]+)\b/)
)
)(createStore);
} else {
return compose(
applyMiddleware(thunk)
)(createStore);
}
})();
function configureStore(initialState) {
const store = createStoreWithMiddleware(rootReducer, initialState);
if (module.hot) {
// Enable Webpack hot module replacement for reducers
module.hot.accept("./reducers", () => {
const nextReducer = require("./reducers");
store.replaceReducer(nextReducer);
});
}
return store;
}
var appStore = configureStore();
export default appStore;
I would like to find have a way to avoid getting redux dev tool pick up redux-form changes. Any better solution will be welcome :)
I think that redux-devtools-filter-actions is the elixir you seek. It was recommended in this thread complaining about redux-form verbosity.
You can go to Options of redux devtools extensions in your browser and there is a field, where you can specify actions which should be ignored. Type there 'redux-form/CHANGE' it this should work.