I'd followed the integration instructions to connect my builder.io account to my qwik application running on localhost:5143 and setup a test page to start playing with visual editor but I got this error on localhost:
10:47:31 PM [vite] Internal server error: Cannot read property 'useQwikCityEnv' of null
File: /Users/mra/development/personal/qwik/node_modules/#builder.io/qwik-city/index.qwik.mjs:265:14
263| };
264| const QwikCityProvider = /* #__PURE__ */ componentQrl(inlinedQrl(() => {
265| const env = useQwikCityEnv();
| ^
266| if (!env?.params)
267| throw new Error(`Missing Qwik City Env Data`);
and I didn't find any resources online why it happened.
After several tries I'd found the issue and the solution:
instead of running the local app with dev command which is a browser only render, you should run start command to enable local ssr as well;
npm run start
I wanted to try automated testing with Vue3 for my next project.
When I created my app using Vite and selected that I would like to test with Cypress everything seems to work fine but...
Although project starts like it suppose to when i type in console npm run lint I receive an error message saying:
C:\Users\myname\Desktop\vue-project\cypress\support\component.js
27:1 error 'Cypress' is not defined no-undef
and this is the line in which error occurs:
Cypress.Commands.add("mount", mount);
Any help from you guys would be appreciated
Ok so maybe someone will find it helpful.
It appears that problem with this one considers mainly ESlint.
If you can not run Cypress with command npm run test:unit:
make sure Cypress is also installed globally.
Then simply ignore ESlint errors considering cypress and don't change this line - const { defineConfig } = require("cypress"); even if lint suggest
doing it.
Congrats, you now should be able to run tests with Cypress :)
Bonus: if you do mind errors in your console and wanna keep it clean you search for some lint setup considering Cypress, to find a good setup for your lint if you do mind errors in your console.'eslint-plugin-cypress' didn't do the trick for me.
In my project we had Jest running just fine and as far as I know no test dependencies were changed. When tests would fail it would log out the details of what was expected versus what was received. But if I have a failing test now (or try to make it fail like the following example) all I get is an error around pretty-format options:
when provided no parameters other than text › default values are set correctly
pretty-format: Unknown option "maxWidth".
48 |
49 | it('default values are set correctly', async () => {
> 50 | expect(element.variant).toBe('primarzy');
It should be telling me that it expected "primarzy" (misspelled on purpose) but got "primary". This is happening no matter which test suite has a failed test.
So for anyone else who encounters this, apparently different packages in my test dependencies were trying to run different versions of pretty-format breaking failed test output. The fix for me was just manually installing pretty-format:
npm i pretty-format --save-dev
Everything works fine after that.
I'm trying to get Spartacus to work with SSR. When opening the default URL, http://localhost:4200, the storefront renders, as expected, but only after I clear the site data first. When I attempt to browse the storefront, API calls fail with a 504 (Gateway timeout). Chrome dev tools indicates the error is happening in the service worker. At this point, I'm wondering if I configured Spartacus incorrectly. When running Spartacus using yarn start rather than yarn serve:ssr, I can load the home page and browse the site normally.
OS: Ubuntu 16.04.6 LTS
Chrome Version: 73.0.3683.75
Node version: 11.15.0
Angular CLI version: 8.3.8
Yarn version: 1.19.1
ng new ssr-spartacus-app --style=scss
cd ssr-spartacus-app
ng add #spartacus/schematics --baseUrl https://localhost:9002 --baseSite cmssiteuid --pwa --ssr
rm src/app/app.component.html
echo "<cx-storefront>Loading...</cx-storefront>" > src/app/app.component.html
yarn build:ssr
yarn serve:ssr
Before running yarn build:ssr, I made following change to the app.module.ts file:
Before
context: {
baseSite: ['cmssiteuid'],
},
After
authentication: {
client_id: 'mobile_android',
client_secret: 'secret',
},
context: {
urlParameters: ['baseSite', 'language', 'currency'],
baseSite: ['cmssiteuid'],
},
I also set anonymousConsents to false. With this set to true, I was getting a lot of CORs errors.
If been scratching my head with this for a little while now and I'm hoping someone with more knowledge of Spartacus' inner workings can shed some light on why Spartacus is behaving this way with SSR.
I'm not sure that I can give you some certain recipe to fix the issue, obviously I need more details and logs relates to your problem, but still, based on my experience I can share with you some tips and tricks about how we should play with such issues (which relates to SSR).
Some set of theory which relates to SSR
https://angular.io/guide/universal (you can feel free to use Angular official documentation as a primary source, cuz Spartacus uses Angular OOTB features to make it works)
https://sap.github.io/spartacus-docs/server-side-rendering-in-spartacus/
https://enable.cx.sap.com/tag/tagid/spartacus (SSR related videos)
Practical approaches for debugging SSR
You should observe and analyze console output during starting your application in Node.js
You can use SSR configuration from example Storefront application (https://github.com/SAP/spartacus/tree/develop/projects/storefrontapp) like a starting point, cuz OOTB SSR works like a charm
Something from Spartacus team https://sap.github.io/spartacus-docs/how-to-debug-server-side-rendered-storefront/
Common set of theory to ensure that application has been configured correctly
SAP Commerce Cloud configuration for working with Spartacus https://sap.github.io/spartacus-docs/installing-sap-commerce-cloud/
Take a look on the guide https://sap.github.io/spartacus-docs/building-the-spartacus-storefront-from-libraries/ to ensure, that your frontend application has correct configuration
Double check your configuration which B2cStorefrontModule is using (here you can find an example project here https://github.com/SAP/spartacus/tree/develop/projects/storefrontapp)
Take a look on Network and Console browser tabs and try to resolve all errors
did you turn off PWA?
Turn PWA off.
As soon as Spartacus is installed in PWA mode, a service worker is installed, and it serves a cached version of index.html, along with the js files. This results in SSR being completely skipped. The following steps describe how to turn off PWA:
Check that there are no service workers registered in your app. If you do find any service workers, remove them.
Turn PWA off in your app module configuration, as follows:
StorefrontModule.withConfig({
backend: {
occ: {
baseUrl: 'https://[your_enpdoint],
},
},
pwa: {
enabled: false,
},
};
Rebuild your local Spartacus libraries by running the following command:
yarn build:core:lib
Build your local Spartacus shell app by running the following command:
yarn build --prod
Build the SSR version of your shell app by running the following command:
yarn build:ssr
Start Spartacus with the SSR server by running the following command:
yarn serve:ssr
If you are getting 504 after hitting the API service you need to check your API logs.
IF you have err log:
{"instant":{"epochSecond":1644915623,"nanoOfSecond":929833000},"thread":"hybrisHTTP1","level":"ERROR","loggerName":"org.springframework.web.servlet.DispatcherServlet","message":"Context initialization failed","thrown":{"commonElementCount":0,"localizedMessage":"Error creating bean with name 'cartEntriesController': Injection of resource dependencies failed; nested exception is org.springframework.beans.factory.UnsatisfiedDependencyException: Error creating bean with name 'defaultStockValidator' defined in ServletContext resource [/WEB-INF/config/v2/validators-v2-spring.xml]: Unsatisfied dependency expressed through constructor parameter 0: Could not convert argument value of type [de.hybris.platform.ycommercewebservices.stock.impl.DefaultCommerceStockFacade] to required type [de.hybris.platform.commercewebservices.core.stock.CommerceStockFacade]: Failed to convert value of type 'de.hybris.platform.ycommercewebservices.stock.impl.DefaultCommerceStockFacade' to required type 'de.hybris.platform.commercewebservices.core.stock.CommerceStockFacade'; nested exception is java.lang.IllegalStateException: Cannot convert value of type 'de.hybris.platform.ycommercewebservices.stock.impl.DefaultCommerceStockFacade' to required type 'de.hybris.platform.commercewebservices.core.stock.CommerceStockFacade': no matching editors or conversion strategy found","message":"Error creating bean with name 'cartEntriesController': Injection of resource dependencies failed; nested exception is org.springframework.beans.factory.UnsatisfiedDependencyException: Error creating bean with name 'defaultStockValidator'
You can try resolution:
Remove template extension ycommercewebservices extension from manifest.json, rebuild and redeploy with "Migrate Data" mode.
I have a simple, bare-bones integration test for a component which depends on an i18n service (which the test injects). The component itself is a simple select dropdown from ember-select-list, with a default value of Select Language. Here's the test:
import { moduleForComponent, test } from 'ember-qunit';
import hbs from 'htmlbars-inline-precompile';
moduleForComponent('language-select', 'Integration | Component | language select', {
integration: true,
beforeEach() {
this.inject.service('i18n');
}
});
test('it renders', function(assert) {
this.render(hbs`{{language-select}}`);
assert.equal(this.$().text().trim().includes('Select Language'), true);
});
When I attempt to just run this one test file (i.e. ember test -f "language-select"), the output I see indicates that only linting tests were performed:
[ hospitalrun-frontend ] $ ember test -f "language-select"
WARNING: Node v7.5.0 is not tested against Ember CLI on your platform. We recommend that you use the most-recent "Active LTS" version of Node.js.
cleaning up...
Built project successfully. Stored in "/Users/richie.thomas/Desktop/Workspace/OpenSource/hospitalrun-frontend/tmp/core_object-tests_dist-5MT1adu7.tmp".
ok 1 PhantomJS 2.1 - ESLint - acceptance/language-select-test.js: should pass ESLint
ok 2 PhantomJS 2.1 - ESLint - components/language-select.js: should pass ESLint
ok 3 PhantomJS 2.1 - TemplateLint - hospitalrun/templates/components/language-select.hbs: should pass TemplateLint
ok 4 PhantomJS 2.1 - ESLint - integration/components/language-select-test.js: should pass ESLint
1..4
# tests 4
# pass 4
# skip 0
# fail 0
# ok
However when I run a plain ember test, I see that this test fails because I am apparently injecting the i18n service incorrectly:
not ok 488 PhantomJS 2.1 - Integration | Component | language select: it renders
---
actual: >
null
expected: >
null
stack: >
http://localhost:7357/assets/hospitalrun.js:4090:18
get#http://localhost:7357/assets/vendor.js:35757:32
get#http://localhost:7357/assets/vendor.js:40664:22
compute#http://localhost:7357/assets/vendor.js:33758:29
value#http://localhost:7357/assets/vendor.js:33625:52
value#http://localhost:7357/assets/vendor.js:65639:37
value#http://localhost:7357/assets/vendor.js:33512:34
create#http://localhost:7357/assets/vendor.js:31495:53
evaluate#http://localhost:7357/assets/vendor.js:66320:43
execute#http://localhost:7357/assets/vendor.js:72898:36
render#http://localhost:7357/assets/vendor.js:72472:30
render#http://localhost:7357/assets/vendor.js:30793:52
runInTransaction#http://localhost:7357/assets/vendor.js:41756:28
_renderRoots#http://localhost:7357/assets/vendor.js:31058:64
_renderRootsTransaction#http://localhost:7357/assets/vendor.js:31096:26
_renderRoot#http://localhost:7357/assets/vendor.js:31017:35
_appendDefinition#http://localhost:7357/assets/vendor.js:30930:23
appendOutletView#http://localhost:7357/assets/vendor.js:30913:29
invoke#http://localhost:7357/assets/vendor.js:19795:19
flush#http://localhost:7357/assets/vendor.js:19865:15
flush#http://localhost:7357/assets/vendor.js:19989:20
end#http://localhost:7357/assets/vendor.js:20059:28
run#http://localhost:7357/assets/vendor.js:20182:19
run#http://localhost:7357/assets/vendor.js:40972:32
render#http://localhost:7357/assets/test-support.js:20665:30
http://localhost:7357/assets/tests.js:15398:16
runTest#http://localhost:7357/assets/test-support.js:3859:34
run#http://localhost:7357/assets/test-support.js:3845:13
http://localhost:7357/assets/test-support.js:4037:15
advance#http://localhost:7357/assets/test-support.js:3522:26
begin#http://localhost:7357/assets/test-support.js:5213:27
http://localhost:7357/assets/test-support.js:4407:11
message: >
Died on test #1 http://localhost:7357/assets/tests.js:15392:24
exports#http://localhost:7357/assets/vendor.js:123:37
requireModule#http://localhost:7357/assets/vendor.js:38:25
require#http://localhost:7357/assets/test-support.js:19547:14
loadModules#http://localhost:7357/assets/test-support.js:19539:21
load#http://localhost:7357/assets/test-support.js:19569:33
http://localhost:7357/assets/test-support.js:7584:22: undefined is not an object (evaluating 'i18n.get')
Log: |
...
I don't see anything in the documentation here about the filter flag affecting the type of tests that are run (i.e. lint vs non-lint tests).
I'm happy to post a separate question about how to properly inject the i18n service, but my question here is:
Why does adding the filter flag result in only filtering tests being run?
It filters module names, not file names. You have dash inside a filter string. Remove it and use space instead:
ember test -f "language select"