Nativescript: Transferring mp3 files with Sidekick - nativescript

I'm making a simple app that uses nativescript-audio and I want to play some mp3 samples in the app. The problem is, when I click "Run on Device" in Sidekick, it doesn't transfer any mp3 files I included in the app folder (and therefore I can't play it). What is weird is that if I just change the extension of the file (for example to .jpg), the transfer works fine (and I can even play that file as if it was mp3).
So, just to exemplify the problem, if I use this code, it doesn't work:
const audio = require('nativescript-audio');
const player = new audio.TNSPlayer();
const playerOptions = {
audioFile: '~/audio/myfile.mp3',
loop: false
};
But if I just rename "myfile.mp3" to "myfile.jpg", change the code like this:
...
audioFile: '~/audio/myfile.jpg',
...
and then rebuild the app, it works just fine and plays the sample that was originally stored in myfile.mp3 and is now stored in myfile.jpg.
Using file-system I can also detect the .jpg file is present but .mp3 is not.
What I want to ask is whether Sidekick looks only for certain file extensions and ignores the others during build, and whether I can change the "watched file extensions" setting.

I guess you are running with webpack, the default webpack configuration will copy only fonts and images (JPEG / PNG etc.,) along with your source code. If you have any other files to be copied modify the copy plugin configurations inside webpack.config.js something like,
new CopyWebpackPlugin([
{ from: "fonts/**" },
{ from: "songs/**" },
{ from: "**/*.jpg" },
{ from: "**/*.png" },
{ from: "**/*.png" },
], { ignore: [`${relative(appPath, appResourcesFullPath)}/**`] }),

Related

NativeScript Downloader plugin: Can not open zip file after downloading the file

I am working on native script 8 and using ns plugin add #triniwiz/nativescript-downloader plugin to download the zip file from the server.
I get the download response
"status": "completed",
"path": "file:///data/user/0/com.myapp.example/cache/1bbf6484-9c77-4357-9759-1c1a55011a21"
but when the plugin tries to unzip the same downloaded file it gives me this
File does not exist, invalid archive path: file:///data/user/0/com.myapp.example/cache/1bbf6484-9c77-4357-9759-1c1a55011a21
I am using #nativescript/zip for unzipping the downloaded file.
unZipFile(path, unzipPath) {
let destination = fs.path.join(this.document.path,"/assets/",unzipPath);
return Zip.unzip({
archive: path,
directory: destination,
onProgress: this.onUnZipProgress
}).then((res) => {
console.log(res);
return destination;
}).catch((err) => {
return 'failed-----------------:'+err;
});
}
not sure if there is something wrong with the code or the plugin, can someone please help?
Check the download directory you're using. You likely should be using only the temp or documents known folders. See the [NativeScript File System][1] docs for details.
I've seen a problem similar to this where it looks like the file downloaded successfully but in fact failed due to security restrictions. This is especially true on iOS.
[1]: https://v7.docs.nativescript.org/ns-framework-modules/file-system

nativescript fails to run with an exit code of 0

I've started having problems getting nativescript to run, and the error message is truly confusing, since it is exit code 0.
tns run android
Searching for devices...
NativeScript Environment: tns run <platform> --env not provided.
NativeScript Environment: Environment vars not changed
Preparing project...
File change detected. Starting incremental webpack compilation...
webpack is watching the files…
Executing webpack failed with exit code 0.
I've tried the usual suspect list of remedies: uninstall/reinstall nativescript, platforms, etc. tns doctor gives me a full green-checkmark bill of clean health.
This just started happening today. I've been using it without this problem for over a year of development prior.
What should I try next?
Well, this is working again now for me.
Here's what I found:
I found I was able to build a different project without issue, but not my main work.
After other messing about, I finally was given an error message that complained that my webpack.config.js was different than that of one of my plugins. It suggested I run ./node_modules/.bin/update-ns-webpack --configs to revert to an approved configuration.
I did that, and it worked. However, I had deliberately modified my webpack config some time ago to allow some app-specific files to transfer, as shown below.
I put my custom 'globs' lines back in and it still works, although this is the same as where it was when the whole affair started.
go figure.
// Copy assets to out dir. Add your own globs as needed.
new CopyWebpackPlugin([
{ from: { glob: "fonts/**" } },
{ from: { glob: "**/*.jpg" } },
{ from: { glob: "**/*.png" } },
{ from: { glob: "**/*.json" } },
{ from: { glob: "**/*.map" } }
], { ignore: [`${relative(appPath, appResourcesFullPath)}/**`] }),
(the *.json and *.map entries are my additions). As the comment implies, this appears to be an encouraged form of config modification for this purpose.

How to upload an PDF file with cypress.io

I would like to upload a PDF file using cypress.
The idea will be to go and find the pdf file into my directory.
I didn't find some way yet.
This is the element used to upload
2022 Update
Since Cypress v9.3.0 you can use
.selectFile('fileName.pdf')
you can find more details about it in Cypress api docs
Cypress doesn't support file upload out of the box.
cypress-file-upload is a npm package which provides a custom cypress command to upload files easily.
But, it requires the file to be present in the fixtures folder.
Sample code for uploading pdf file:
const fileName = 'myfile.pdf';
cy.fixture(fileName).then(fileContent => {
cy.get('#filesToUpload').upload({ fileContent, fileName, mimeType: 'application/pdf' }, { subjectType: 'input' });
});
You can also find more workarounds here: https://github.com/cypress-io/cypress/issues/170
As mentioned by #bushra you need to install the 'cypress-file-upload' package and then you can do this :)
Cypress.Commands.add("UploadFile", function () {
cy.fixture("someFile", "binary")
.then(Cypress.Blob.binaryStringToBlob)
.then((fileContent) => {
cy.get('someElement').attachFile({
fileContent,
filePath: "someFile.pdf",
fileName: "someFile.pdf",
});
});

Laravel-mix versioning when uploaded in S3 thinks in previous hash

With using webpack-s3-plugin npm package, I'm saving my laravel-mix compiled & versioned files into S3 (for cdn purposes).
Bare in mind, this was working until yesterday.
let webpackPlugins = [];
if (mix.inProduction() && process.env.UPLOAD_S3) {
webpackPlugins = [
new s3Plugin({
include: /.*\.(css|js)$/,
s3Options: {
accessKeyId: process.env.AWS_KEY,
secretAccessKey: process.env.AWS_SECRET,
region: process.env.AWS_REGION,
},
s3UploadOptions: {
Bucket: process.env.ASSETS_S3_BUCKET,
CacheControl: 'public, max-age=31536000'
},
basePath: 'assets/' + process.env.APP_ENV,
directory: 'public'
})
]
}
mix.scripts([ // I also tried '.combine'
'resources/js/vendor/vendor/jquery.slimscroll.js',
'resources/js/vendor/custom/theme-app.js',
], 'public/js/scripts.js')
// Other bundling stuff
.js([...].version()
mix.webpackConfig({
plugins: webpackPlugins
});
Now, S3's eTag doesn't match to mix-manifest.json hash. And, when I visit the page, it fetches 1 version behind, not the latest uploaded but exactly 1 previous version. However, when I check the 'updated date' on S3, it's correct. Nevertheless, it's exactly one version behind.
What I suspect is it is uploading to s3 before the bundling is completely done; however I am not sure. What am I missing here?
I used this guide if you want to know the laravel side in detail.
After diving around the S3 plugin source, I am fairly confident this is caused by the hook used to trigger the S3 upload. I don't know enough about webpack plugins to give a full description of this, but I have made an educated guess at what is causing the issue and my proposed fix seems to have sorted the issue.
The author of the plugin has accepted my pull request and the fix is currently awaiting release.
If you need a fix in the meantime, then you can do it like so (note, this is very dirty and should be treated as temporary):
Browse to your node_modules folder
Locate the folder named webpack-s3-plugin
Copy the file dist/s3_plugin.js
Paste somewhere in your project
Open the file and locate the line t.hooks.afterEmit.tapPromise
Replace with t.hooks.done.tapPromise
In your webpack.mix.js file, change the require('webpack-s3-plugin') to point to your javascript file
Just to reiterate, this is a temporary fix until the latest version of the plugin is released.

PhoneGap Build API for Node.js - Unable to load a custom build

I am trying to upload a zip file containing my App into PhoneGap Build by using the API with Node.js but it doesn't work, it does if I upload the file manually from the website.
After a successfully authentication with this piece of code:
pgBuild.auth({ token: phonegapBuildToken }, authenticationResponse);
in my callback I do the following:
function authenticationResponse(e, api){
unlockAndroidKeyMethod(api);
unlockiOSKeyMethod(api);
var options = {
form: {
data: {
platforms: ['android', 'ios']
},
file: './www/xxx.zip'
}
};
api.post(phonegapEndpoint + '/build', options, function(ee, data) {
console.log('## BUILD IN PROGRESS...');
console.log(ee);
console.log(data);
//waitingForPendingBuild(api);
});
}
inside the option I am pointing to the file I want to load
file: './www/xxx.zip'
the problem is that whatever I put there it doesn't get picked up, what PhoneGap Build builds is the file always the file loaded through the website.
Can I get some help, please? :)
Thanks
PS: I get no error
I have managed to solved this problem - it was a problem on how I create the zip file apparently...PhoneGap Build API don't like zip files done with gulp-zip, using archiverjs (https://archiverjs.com/docs/) solves the issue :)
Thanks

Resources