Files in ' tests' not working

[thmsklngr]

UIkit Version

3.5.3

Actual Behavior

Opened index.html but the whole page is unformated. Looked into inspector and saw, that the file js/test.js cannot be loaded, because it does not exist there. Changed the filename in index.html to js/index.js, which is existing, but the error is now:

SyntaxError: import declarations may only appear at top level of a module

Expected Behavior

Index page should work as expected to see how UIKit is working

Reproduction Link

n/a

Steps to Reproduce the Problem

1. clone Git repository to your local drive
2. open uikit/tests/index.html in your webbrowser
3. open the browsers inspector to see the error message

[Rajesh-Royal]

a possible solution to SyntaxError: import declarations may only appear at the top level of a module or Cannot use import statement outside a module is adding a type="module" attribute to the script tag.

But after loading script with type="module" it cause a new issue Access to Script at ' from origin 'null' has been blocked by CORS policy
It can be solved by using a live server [ex. VS Code local server].

But again it causes a new error with import statement with 404 file not found because when we import a module from js file as import {on} from '../../src/js/util/event'; it possibly loading the folder instead of a file.

This error can be fixed by adding .js extension at the end of the file name.

After all file import success, It causes a new error with themes.json as there is no such file in the directory.

code which load .json file:

const request = new XMLHttpRequest(); request.open('GET', '../themes.json', false); request.send(null);

I don't know what was Inside the theme.json file, It's up to original developers how they solve it.

If we use a dummy themes.json there are more errors.

[caruanas]

Has there been an update on this? Or perhaps there's an alternative? Or some other way to test/design our custom styles?

Thanks

[algo99]

Actually everything works perfectly (at least UIkit v3.6.16):

1. Clone UIkit Git repository to your local drive $ git clone https://github.com/uikit/uikit.git
2. $ cd uikit
3. Start up a local HTTP server in that directory, for example using Python 3 $ python -m http.server
4. Open in browser http://localhost:8000/tests/

For an explanation why some *.html files won't run if you open them as local files (and that's why you need a local HTTP server) see https://developer.mozilla.org/en-US/docs/Learn/Common_questions/set_up_a_local_testing_server

Btw. a custom theme (compiled as described here) will be attached automatically to the test page, so one can visualize/check the theme.

[sinnzri]

I cloned uikit 3.7.4 and the issue mentioned in the first post is still exist for all html files in tests folder.